Cara Kompres File Javascript Dengan PHP

Setelah sebelumnya kita bahas menganai cara kompres file javascript dengan YUICompressor, Closure Compiler, dan UglifyJs, pada kesempatan ini kita akan bahas cara kompres file javascript dengan PHP.

Ketiga kompresor diatas dapat menghasilkan kompresi yang sangat bagus, namun kelemahannya hanya dapat dijalankan melalui command prompt.

Maka, bagi pengguna PHP, jika tidak kita tidak memiliki akses pada command prompt (melalui perintah exec), dapat menggunakan alternatif  ini.

Library PHP Untuk Kompres File Javascript

Terdapat beberapa Library maupun class PHP yang dapat digunakan untuk mengkompres file javascript namun hampir semuanya tidak ada yang meng obfuscate / mangle, sehingga hasil yang diperoleh belum maksimal, kompresi hanya akan menghilangkan comment, spasi, dll.

Salah satu library PHP yang memiliki fitur mangle  adalah JS Squeze, namun hasilnya tidak 100% aman, dimana kode javascript menjadi error, kita bahas dibawah.

Terlepas dari itu semua, mari kita bahas beberapa library PHP yang populer digunakan untuk mengkompres file javascript

I. Kompres File Javascript Dengan Mathismullie Minify

Kompresor ini aktif dikembangkan dan memiliki hasil kompresi yang cukup bagus.  Untuk menggunakannya , diperlukan langkah sebagai berikut:

  1. Buat working directory, didalam folder htdocs, misal: saya membuat folder dengan nama minifier.
  2. Install library. Instalasi bisa dilakukan menggunakan composer atau manual, cara manual dilakukan dengan mendownload repo di Github

    Download PHP Minify dari Github

  3. Selanjutnya, ekstrak file ke direktori yang telah kita buat, perlu diperhatikan bahwa folder data dan src  harus berada pada direktori yang sama. Pada contoh ini saya letakkan di dalam folder htdocs/minifier

    Struktur Direktory PHP Minify

  4. Letakkan file javascript ke direktori yang telah kita buat, misal saya menggunakan library jquery-1.12.4.js.
  5. Buat file .php, misal minify_javascript.php  kemudian tulis kode berikut:
    $path = 'src';
    require_once $path . '/minify/src/Minify.php';
    require_once $path . '/minify/src/JS.php';
    require_once $path . '/minify/src/Exception.php';
    
    use MatthiasMullieMinify;
    $minifier = new MinifyJS('jquery-1.12.4.js');
    $minifier->minify('jquery-1.12.4.min.js');

    Simpan file tersebut pada direktori yang telah kita buat tadi.

  6. Jalankan file minify_javascript.php  melalui browser http://localhost/minify_javascript.php, hasilnya tampak seperti gambar dibawah:

    Hasil Kompres File Javascript Dengan PHP - Minify

    Ukuran file berkurang hingga 48.8%

II. Kompres File Javascript Dengan PHP – JSShrink

Library kedua yang dapat kita gunakan adalah JSShrink. Library yang hanya terdiri dari satu file ini masih aktif dikembangkan, untuk menggunakannya:

  1. Download file Minifier.php  dari github kemudian copy  kedalam direktori src (htdocsminifiersrc)
  2. Copy file javascript yang ingin kita kompres ke dalam folder minifier, misal kita gunakan file jquery-1.12.4.js seperti  pada contoh sebelumnya.
  3. Buka code editor, misal notepad++ kemudian tulis kode berikut:
    include('srcjsshrink.php');
    
    $jsCode = file_get_contents('jquery-1.12.4.js');
    $minifiedCode = JShrinkMinifier::minify($jsCode, array('flaggedComments' => false));
    file_put_contents('jquery-1.12.4.min.js', $minifiedCode);

    Selanjutnya simpan sebagai file .php (misal  minify_jsshrink.php)  dan letakkan di dalam direktori minifier.

  4. Jalankan file php tersebut pada browser (http://localhost/minifier/minify_jsshrink.php). Hasil yang kita peroleh adalah:

    Hasil Kompres File Javascript Dengan PHP - JSShrink

    Ukuran file berkurang hingga 48.1%, namun lebih besar 2 kb dari kompresor sebelumnya.

III. Kompres File Javascript Dengan PHP –  JSQueeze

Library ketiga yang dapat kita gunakan adalah JSQueezee. Library ini juga hanya berupa satu file dan hingga saat ini masih aktif dikembangkan.

Berbeda dengan sebelumnya, library ini mampu mem mangle  kode  javascript sehingga file yang dihasilkan jauh lebih compact. Namun, seperti disebutkan sebelumnya, bahwa library ini tidak 100% aman. Mari kita coba:

  1. Download file jssqueeze.php dari github kemudian copy  kedalam direktori src (htdocsminifiersrc)
  2. Seperti  pada contoh sebelumnya, copy file jquery-1.12.4.js ke direktori minifier.
  3. Buka code editor, misal notepad++ kemudian tulis kode berikut:
    $jz 		= new JSqueeze();
    $jsCode 	= file_get_contents('jquery-1.12.4.js');
    $minifiedJs = $jz->squeeze(
        $jsCode,
        true,   // $singleLine
        false,  // $keepImportantComments
        false   // $specialVarRx
    );
    file_put_contents('jquery-1.12.4.min.js', $minifiedJs);

    simpan dengan ekstensi .php (misal  minify_jsqueeze.php)  dan letakkan di dalam direktori minifier.

  4. Buka browser dan jalankan file minify_jsqueeze.php tersebut  (http://localhost/minifier/minify_jsqueeze.php). Hasil yang kita peroleh adalah:

    Hasil Kompres File Javascript Dengan PHP - JSQueeze

    wow, ternyata ukuran file dapat berkurang hingga 65.2%, jauh mengungguli 2 library sebelumnya.

Tes apakah file hasil kompresi dapat berjalan dengan baik

Jika sobat menggunakan kompresor javascript yang memiliki fitur mangle yang salah satu ciri nya adalah ukuran file yang dihasilkan berkurang sangat signifikan, maka pastikan file hasil kompresi dapat berjalan dengan baik.

Pengujian sederhana

Untuk melakukan pengujian, buat file .html sederhana, misal tes_kompresihtml, kemudian ketikkan kode berikut:

<!DOCTYPE HTML>
<html>
<head>
	<title>Tes Hasil Kompresi JSQueeze</title>
	<script src="jquery-1.12.4.min.js"></script>
</head>
<body>
	Tes hasil kompresi file javascript dengan JSQueeze
</body>
</html>

simpan file tersebut pada direktori minifier, kemudian jalankan pada browser, misal chrome. Selanjutnya, cek menggunakan Developer Tools bagian console, apakah muncul pesan error.

Tes Hasil Kompresi File Javascript Menggunakan JSQueeze

Dari contoh diatas, terlihat bahwa file javascript tersebut error. Hal ini mungkin karena file yang kita gunakan untuk ujicoba terlalu kompleks.

Meski demikian, kompresor ini tetap dapat digunakan, dan kebetulan saja pas dicoba terjadi error. Sobat dapat bereksperimen dengan mencoba file lain  atau melaporkan bug ke penulisnya.

Library Lainnya…

Terdapat satu lagi library PHP yang dapat digunakan untuk meng kompres file javascript, yaitu: Mrclay Minify. Library ini juga aktif dikembangkan dan memiliki sangat banyak fitur yang berguna termasuk menggabungkan file javascript.

Namun sama seperti yang lain, library ini hanya menghilangkan comment, spasi, line break, dan karakter lain yang tidak diperlukan, tidak meng mangle code javascript, sehingga hasilnya sama saja.

Demikian pembahasan cara kompres file javascript dengan PHP, semoga bermanfaat.

Subscibe Now

Suka dengan artikel di Jagowebdev.com? jangan sampai ketinggalan, segera join ke milis kami untuk update informasi terbaru dari Jagowebdev.com

Komitmen Kami: Kami senantiasa menghargai privasi Anda dan tidak akan membagikan identitas Anda ke pihak manapun.

Silakan tinggalkan komentar

Newsletter

Jadilah yang pertama tahu berita terbaru dari Jagowebdev.com