--- title: Gzip dan Brotli description: "Kompresi teks untuk HTML, CSS, dan JS. Brotli memberi rasio lebih kecil; gzip lebih universal." canonical: https://penasihathosting.com/wikihosting/gzip-brotli type: wiki locale: id updated: 2026-10-29 author: Willya Randika --- # Gzip dan Brotli ## Overview - **Summary:** Kompresi teks untuk HTML, CSS, dan JS. Brotli memberi rasio lebih kecil; gzip lebih universal. - **Author:** Willya Randika ([profile](/penulis/willya-randika)) ## Article **Gzip** dan **Brotli** adalah algoritma kompresi untuk aset teks seperti HTML, CSS, JavaScript, JSON, dan SVG. Server mengompres, browser men-decompress; ukuran transfer mengecil dan waktu muat turun. ## Beda singkat | Aspek | Gzip | Brotli | | --- | --- | --- | | Dukungan | Hampir semua browser | Browser modern | | Rasio | Baik | Umumnya 15–25% lebih kecil untuk teks | | Kecepatan kompresi | Cepat | Sedikit lebih lambat | | Kapan dipakai | Fallback universal | Prioritas untuk aset statis | ## Cara mengaktifkan - **LiteSpeed/cPanel:** biasanya aktif otomatis; cek `Content-Encoding` di response. - **Nginx:** aktifkan `gzip on;` dan modul Brotli jika tersedia. - **CDN:** banyak CDN mengompres otomatis di edge. - **WordPress:** plugin cache biasanya menangani HTML dan aset statis. Uji dengan `curl -I -H "Accept-Encoding: br,gzip" https://contoh.com` lalu lihat header `Content-Encoding`. ## Yang perlu diperhatikan - **Jangan kompres gambar/video.** Format itu sudah terkompresi; hasilnya bisa lebih besar. - **Hindari kompresi ganda.** Jika CDN sudah mengompres, origin tidak perlu melakukannya lagi. - **Perhatikan `Content-Length`.** Compression mengubah ukuran; jangan cache header yang salah. - **Brotli butuh HTTPS di banyak setup.** Pastikan koneksi aman. - **Kompresi memakai CPU.** Untuk server kecil, ukur dampaknya sebelum menaikkan level kompresi. File yang sudah terkompresi seperti JPEG, PNG, WebP, MP4, dan ZIP tidak perlu dikompresi lagi. Untuk API yang mengembalikan JSON besar, kompresi sangat membantu; untuk response yang sangat kecil, overhead header bisa lebih besar dari penghematan. Ukur dengan DevTools atau `curl` sebelum mengubah konfigurasi, dan uji di staging agar cache lama tidak menutupi hasil. Dokumentasikan level kompresi yang dipakai dan pantau penggunaan CPU. Periksa header response dan ulangi pengukuran setelah cache aktif. ## FAQ Rasio Brotli biasanya lebih kecil, tetapi Gzip lebih universal dan lebih cepat dikompres. Sediakan keduanya dan biarkan browser memilih. Ada biaya CPU, tetapi biasanya jauh lebih kecil daripada penghematan bandwidth dan waktu transfer. Lihat header `Content-Encoding: br` atau `gzip` pada response HTML/CSS/JS. Jika tidak ada, periksa konfigurasi server atau CDN.