Website atau Web app kamu lamban? mungkin kamu belum melakukan beberapa trik untuk mempercepat Loading website atau web app di Browser. Salah satu trik yang populer dan bisa dibilang wajib adalah Minifikasi Kode.

Minifikasi Kode adalah pembuatan Kode versi mini atau yang ukuran file (file size) lebih kecil dari aslinya dengan menghilangkan baris-baris yang tidak perlu seperti Spasi, Comment dll.

Jenis File yang biasa di Minifikasi adalah HTML, CSS dan Javascript. Dengan meminifikasi ke-3 jenis file diatas, Browser bekerja lebih "santai" sehingga proses loading jadi lebih cepat dan tentu menghemat bandwith pula.

Dan bagi pemilik Website, ini tentu faktor penting yang tidak boleh tidak alias mesti dilakukan untuk mempercepat loading website mereka sehingga lebih user friendly dan Search engine friendly.

Minifikasi HTML, CSS dan Javascript 

Minifikasi HTML sangat penting dilakukan seperti halnya yang Teknosains lakukan, coba CTRL + U di browser kamu dan kamu akan lihat kode HTML yang rapat. 

Untuk me-minifikasi HTML banyak tools yang bisa di pakai, kalau kami sendiri memilih pakai Html Compressor . Kamu juga bisa pakai itu, sangat mudah digunakan. Ini contoh perbandingan ukuran file sebelum dan sesudah minifikasi  

Misal contoh kode asli 

<html>
    <head>
	<style>
		#mycss { font-family: Arial }
		#mycss { font-size: 90% }
	</style>
    </head>
	<body>
		<!-- start myContent -->
			<p id="myid">
			<span>Hello world!</span>
			</p>
		<!-- end myContent -->
	</body>
</html>

Setelah minifikasi 

<html><head><style>#mycss{font-family:Arial;font-size:90%}</style></head><body><p id="myid"><span>Hello world!</span></p></body></html>

Sama halnya dengan HTML, CSS dan javascript pun wajib kita minifikasi agar Loading lebih cepat dan konsumsi bandwith lebih kecil.

Contoh Javascript

//mengambil coockies
function getCookie(name) {
   //vars
   var value = "; " + [removed];
   var parts = value.split("; " + name + "=");

   //check and return
   if (parts.length == 2) {
      return parts.pop().split(";").shift();

   }
}


dan setelah minifikasi Menjadi

function getCookie(a){a=("; "+[removed]).split("; "+a+"=");if(2==a.length)return a.pop().split(";").shift()};



Kamu bisa mengatur agar versi mini nya hanya untuk Website atau Web app yang Live/Production

Contoh di PHP 

<!--?php 
Class Home extends Front_controller
{
private $env = 'production';

  public function __construct()
{
parent::__construct();
}

private function _renderTemplate($view = null, $data = [])
{
if ($this->env === 'production') {
//load header
$this->load->view('headerView-min');
//load body
$this->load->view($view . '-min', $data);
//load footer
$this->load->view('footerView-min');

} else {
//load header
$this->load->view('headerView');
//load body
  $this->load->view($view, $data);
//load footer
$this->load->view('footerView');
}
}

  public function index()
{
$data = [
'meta' => [
'title' => 'Sains & Teknologi',
'description' => 'Sains & Teknologi Update'
],
'css_lib' => [
//css lib here
],
'js_lib' => [
//Javascript library
]
];
//include body view 

$this->_renderTemplate('bodyView', $data);
}
}