Aktifkan kompresi teks

Resource berbasis teks harus ditayangkan dengan kompresi untuk meminimalkan total jaringan {i>byte.<i} Bagian Peluang di laporan Lighthouse Anda mencantumkan semua model resource yang tidak dikompresi:

Screenshot audit kompresi teks Aktifkan Lighthouse

Cara Lighthouse menangani kompresi teks

Lighthouse mengumpulkan semua respons yang:

  • Memiliki jenis resource berbasis teks.
  • Jangan sertakan header content-encoding yang ditetapkan ke br, gzip, atau deflate.

Lighthouse kemudian mengompresinya masing-masing dengan GZIP untuk menghitung potensi penghematan biaya yang signifikan.

Jika ukuran asli respons kurang dari 1,4 KiB, atau jika ukuran potensi penghematan kompresi kurang dari 10% dari ukuran aslinya, maka Lighthouse tidak menandai respons tersebut dalam hasil.

Mengaktifkan kompresi teks di server

Aktifkan kompresi teks di server yang memberikan respons ini untuk lulus audit ini.

Ketika browser meminta resource, browser akan menggunakan Accept-Encoding Header permintaan HTTP untuk menunjukkan algoritma kompresi apa yang didukungnya.

Accept-Encoding: gzip, compress, br

Jika browser mendukung Brotli (br) Anda harus menggunakan Brotli karena dapat mengurangi ukuran file resource lebih dari algoritma kompresi lainnya. Telusuri how to enable Brotli compression in <X>, dengan <X> adalah nama server Anda. Mulai Desember 2022, Brotli didukung di semua browser utama kecuali Safari di iOS. Lihat Kompatibilitas browser untuk mendapatkan info terbaru.

Gunakan GZIP sebagai pengganti Brotli. GZIP didukung di semua browser utama, tetapi kurang efisien dibandingkan Brotli. Lihat Konfigurasi Server untuk contoh.

Server Anda harus mengembalikan Content-Encoding Header respons HTTP untuk menunjukkan algoritma kompresi yang digunakannya.

Content-Encoding: br

Memeriksa kompresi respons

Untuk memeriksa apakah server mengompresi respons:

Tekan Control+Shift+J (atau Command+Option+J di Mac) untuk membuka DevTools. Klik tab Jaringan.

  1. Tekan Control+Shift+J (atau Command+Option+J di Mac) untuk membuka DevTools.
  2. Klik tab Jaringan.
  3. Klik permintaan yang menghasilkan respons yang Anda minati.
  4. Klik tab Header.
  5. Periksa header content-encoding di bagian Respons Header.
Header respons encoding konten
Header respons content-encoding.

Untuk membandingkan ukuran respons yang dikompresi dan didekompresi:

  1. Tekan Control+Shift+J (atau Command+Option+J di Mac) untuk membuka DevTools.
  2. Klik tab Jaringan.
  3. Aktifkan baris permintaan besar. Lihat Menggunakan baris permintaan besar.
  4. Lihat kolom Ukuran untuk respons yang Anda minati. Tujuan nilai tertinggi adalah ukuran terkompresi. Nilai terbawah adalah dekompresi ukuran.

Lihat juga Memperkecil dan mengompresi payload jaringan.

Panduan khusus stack

  • Joomla: Aktifkan setelan Kompresi Halaman Gzip (Sistem > Konfigurasi global > Server).
  • WordPress: Aktifkan kompresi teks di konfigurasi server web Anda.

Resource