Cara Mengaktifkan GZip Compression untuk Optimasi Kecepatan Website
Mengaktifkan GZip compression sering kita dengar sebagai salah satu saran optimasi untuk mempercepat loading website. Proses kompresi dalam optimasi ini akan membuat web server menyajikan ukuran file yang lebih kecil sehingga membuat website lebih cepat untuk pengguna.
Di artikel ini, Panda akan secara khusus mengulas tentang apa itu GZip Compression, keuntungan menggunakan kompresi GZip dan dan cara mengaktifkannya.
Apa itu GZip Compression?
GZip Compression adalah sebuah teknologi yang bisa melakukan proses kompresi atau pengurangan ukuran file secara real time, sehingga bisa membuat transfer data melalui jaringan menjadi lebih cepat dan menghemat bandwidth hosting.
GZip ini sendiri merupakan format file yang terbentuk karena proses kompresi dari sebuah file agar ukurannya lebih kecil.
Dengan kompresi GZip ini, menurut Google Developer kompresi file HTML, javascript dan CSS bisa menghemat sekitar 70-90% ukuran file di halaman. Dengan ukuran yang lebih kecil, waktu yang dibutuhkan untuk meload halaman tentu saja lebih cepat. Sesederhana itu.
Kompresi GZip sendiri merupakan salah satu parameter dalam penilaian di Google PageSpeed Insight dan GTMetrix. Secara ringkas, keuntungan menggunakan kompresi GZip antara lain :
- Memperkecil ukuran halaman website hingga 70-90%
- Menghemat bandwidth hosting karena server memproses request yang lebih kecil
- Meningkatkan kecepatan loading halaman website secara keseluruhan
Cara Kerja GZip Compression
Pada umumnya GZip mempunyai cara kerja yang sederhana. Gzip akan meletakkan string yang sama dalam file teks dan menganttikan string tersebut sementara agar ukuran file secara keseluruhan lebih kecil.
File CSS dan HTML sendiri kerap menggunakan banyak kode teks berulang dan banyak spasi. Dengan GZip yang bekerja mengkompresi string ini, ukuran file bisa lebih kecil 70-90%.
Saat browser mengunjungi web server, browser akan memeriksa apakah server sudah mengaktifkan kompresi GZip. Pengecekan ini dilakukan dengan cara mendeteksi apakah ada header “content-encoding: gzip” di website.
Saat header terdeteksi, file yang sudah dikompress tadi akan ditampilkan. Namun jika tidak menemukan header, maka browser akan menampilkan ukuran asli yang jauh lebih besar kepada pengunjung.
Kendati begitu, tidak semua file di website akan terkompres otomatis ya. File yang akan masuk ke dalam kompresi ini adalah HTML, CSS, JavaScript, JSON, dan XML. Font dan gambar tidak termasuk.
Gambar sendiri mempunyai teknik kompresi yang berbeda dengan file- file website lainnya. Untuk lebih lengkapnya, Anda bisa membaca artikel Panda sebelumnya : 10+ Cara Mengecilkan Ukuran Foto/ Gambar Tanpa Mengurangi Kualitasnya.
Cara Cek Apakah Website Sudah Menggunakan GZip Compression
Salah satu cara termudah untuk menemukan apakah kompresi GZip sudah aktif atau tidak adalah saat menemukan peringatan error di tool pengecek kecepatan website, seperti GtMetrix atau Google Page Speed.
Selain itu, Anda juga bisa menggunakan tool Gzip compression checker dari TechNumero untuk mengecek dengan mudah apakah GZip Compression sudah aktif. Cukup masuk ke website tersebut dan tambahkan URL website Anda, lalu klik Check.
Setelah itu, Anda akan bisa dengan mudah dan jelas melihat status kompresi GZip Anda. Anda juga bisa melihat berapa banyak file ukuran yang berhasil dikompresi.
Cara Mengaktifkan Enable GZip Compression di Website
Ada dua metode yang bisa kita gunakan untuk mengaktifkan GZip Compression di website. Yang pertama adalah melalui plugin caching WordPress yang sudah mendukung kompresi GZip dan yang kedua adalah dengan mengaktifkan module mod_deflate secara manual.
1. Memasang GZip Compression dengan Plugin WordPress
Cara termudah untuk mengaktifkan GZip Compression di website adalah melalui plugin cache yang sudah mendukung kompresi GZip. Salah satunya adalah W3 Total Cache dan WP Optimize.
Untuk mengaktifkan GZip dengan WP Optimize, silahkan masuk ke panel WP Optimized > Cache. Selanjutnya, pilih tab GZip dan pilih ENABLED.
Plugin lain kurang lebih caranya sama. Anda hanya perlu menemukan pengaturan aktivasi kompresi GZip di pengaturan plugin Anda. Anda mungkin bisa menemukannya di sub menu Cache atau Browser Cache.
2. Edit File via .htaccess
Ada dua cara yang bisa Anda gunakan untuk mengaktifkan GZip Compression via .htaccess, yaitu dengan modul mod_gzip dan mod_deflate. Cara yang paling direkomendasikan adalah mod_deflate. Jadi, kami sarankan untuk mencoba metode mod_deflate lebih dulu.
Untuk mengaktifkan GZip dengan mod_deflate, tambahkan kode berikut di .htaccess :
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE image/x-icon
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/x-font
AddOutputFilterByType DEFLATE application/x-font-truetype
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/x-font-otf
AddOutputFilterByType DEFLATE application/x-font-opentype
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/ttf
AddOutputFilterByType DEFLATE font/otf
AddOutputFilterByType DEFLATE font/opentype
# For Older Browsers Which Can't Handle Compression
BrowserMatch ^Mozilla/4 gzip-only-text/html
BrowserMatch ^Mozilla/4\.0[678] no-gzip
BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
</IfModule>
Atau tambahkan kode di bawah ini jika ingin mengaktifkan GZip Compression dengan mod_gzip :
<ifModule mod_gzip.c>
mod_gzip_on Yes
mod_gzip_dechunk Yes
mod_gzip_item_include file \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include mime ^application/x-javascript.*
mod_gzip_item_include mime ^text/.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*
mod_gzip_item_exclude mime ^image/.*
mod_gzip_item_include handler ^cgi-script$
</ifModule>
3. Edit File di nginx.conf untuk Pengguna Server Nginx
Jika web server Anda menggunakan Nginx, Anda bisa enable GZip Compression dengan menambahkan kode di bawah ini di file nginx.conf Anda :
gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon
application/javascript application/x-javascript;
Kesimpulan
GZip Compression adalah metode kompresi ukuran file yang bekerja efektif untuk membuat transfer data melalui jaringan menjadi lebih cepat. Dengan mengaktifkan GZip di website, ukuran file menjadi lebih kecil 70-90% dan tentunya loading website menjadi lebih cepat.
Cara enable GZip Compression ini sendiri terbilang cukup mudah. Anda bisa mengaktifkan kompresi GZip melalui plugin cache yang sudah terpasang di website. Atau bisa juga melakukan editing manual sesuai dengan server yang Anda gunakan.
Setelah mengaktifkannya, jangan lupa untuk mengeceknya dengan tool checker kompresi GZip. Pastikan tidak ada peringatan error dan sekaligus Anda bisa melihat berapa banyak file yang berhasil dikompresi.
Tapi jangan lupa juga, selain kompresi GZip, ada banyak cara lain yang bisa Anda terapkan untuk mempercepat loading website. Anda bisa membaca panduan lain tersebut di artikel Panda : 20+ Cara Ampuh Mempercepat Loading Website.
Selamat mencoba!
