Meningkatkan Google Penelusuran dengan Kamus Kompresi

Carlos Mateo Muñoz

Barry Pollard

Dipublikasikan: 14 Mei 2025

Transpor Kamus Kompresi adalah standar baru yang memungkinkan kita mengompresi konten berulang di seluruh permintaan dan dirilis di Chrome 130 pada akhir tahun 2024. Google Penelusuran telah mengadopsi teknologi baru ini dan mengalami peningkatan yang signifikan.

Peluang

Ada banyak duplikat di halaman web yang kita kunjungi. Banyak halaman di situs yang sama terdiri dari sebagian besar kode yang sama—baik HTML, CSS, maupun JavaScript, dengan hanya konten di antara semua kode ini yang berubah. Meskipun setiap hasil adalah kombinasi unik dari ratusan fitur yang menghasilkan konten yang benar-benar unik, masih ada banyak kesamaan dalam kode yang dikirim ke browser untuk menghasilkannya.

Secara visual, sebagian besar halaman hasil Penelusuran terlihat agak mirip, apa pun istilah penelusuran yang dimasukkan: Di bagian atas, terdapat logo Google, kotak penelusuran, dan beberapa kontrol. Di bagian tengah, kami memiliki beberapa tab untuk jenis penelusuran, lalu daftar hasil penelusuran di sebelah kiri yang diselingi dengan berbagai widget untuk membantu pengguna, dan konteks tambahan di sebelah kanan dengan panel "tentang":

Terakhir, di bagian bawah, kita memiliki opsi penomoran halaman dan footer standar. Ini hanyalah yang tersedia secara visual—di balik layar, ada banyak kode (HTML, CSS, dan JavaScript) untuk menghasilkan halaman ini. Sebagian besar kode ini disisipkan langsung ke dalam HTML halaman sebagai pengoptimalan performa. Meskipun hal ini memungkinkan pemuatan halaman yang lebih cepat, hal ini akan menimbulkan biaya karena tidak membagikan kode tersebut di antara berbagai halaman hasil—seperti yang akan diizinkan oleh resource yang di-cache secara eksternal.

Kompresi di web

Kompresi adalah teknologi yang banyak digunakan untuk web. Memampatkan resource dengan gzip, atau algoritma yang lebih baru seperti Brotli atau Zstandard, memungkinkan pengulangan dalam file dihindari dengan kompresi lossless untuk memaketkan semua informasi serapat mungkin di server sebelum dikirim. Kemudian, browser dapat mengekstrak byte yang dikompresi untuk memulihkan konten aslinya. Untuk gambar, kompresi lossy menawarkan manfaat serupa dengan menghapus byte tambahan yang mungkin tidak terlihat berbeda bagi pengguna.

Hingga baru-baru ini, kompresi di web telah dibatasi untuk kompresi dalam resource. Anda tidak dapat mengompresi di berbagai resource, dan tentu saja tidak di berbagai halaman. Hal ini telah lama dikenal sebagai batasan yang ingin diperbaiki oleh engineer web.

Transpor Kamus Kompresi dapat membantu.

Compression Dictionary Transport adalah standar baru yang memungkinkan kompresi di seluruh resource dengan penggunaan "kamus" bersama yang memungkinkan serangkaian byte umum diganti dengan referensi dari kamus bersama tersebut.

Algoritma kompresi modern seperti Brotli dan Zstandard mendukung penggunaan kamus istilah umum yang memungkinkan kompresi yang lebih besar dengan mengganti istilah tersebut dengan referensi yang lebih kecil ke kamus. Brotli bahkan dilengkapi dengan kamus bawaan istilah web umum. Transpor Kamus Kompresi dibuat berdasarkan hal ini dengan menyediakan cara bagi server dan browser untuk berbagi kamus kustom.

Kamus kustom dapat berupa referensi yang sudah digunakan di situs. Misalnya, Anda dapat menggunakan app.v1.js sebagai kamus saat mendownload app.v2.js untuk pada dasarnya hanya mendownload perbedaan (sering disebut "kompresi delta"). Atau, resource kamus terpisah dapat ditentukan dengan tag <link rel="compression-dictionary"> (atau header HTTP Link yang setara).

Hal ini dapat secara drastis mengurangi ukuran download resource dengan banyak konten atau kode bersama, seperti halaman hasil Penelusuran yang disebutkan sebelumnya.

Penggunaan kamus kompresi oleh Google Penelusuran

Tim Google Penelusuran terus berupaya meningkatkan performa Penelusuran. Mereka adalah pengguna awal kamus kompresi karena melihat potensi teknologi ini.

Penelusuran menggunakan kompresi Brotli bersama untuk halaman hasilnya dengan file kamus terpisah yang dibuat dari sampel hasil penelusuran yang representatif. Pipeline otomatis yang andal memastikan kamus tetap baru, selaras dengan konten SRP yang sering berubah dan dirilis beberapa kali sehari. Anda dapat menggunakan DevTools untuk melihat cara kerjanya secara persis.

Saat klien pertama kali memuat halaman hasil penelusuran, server akan memberikan link ke kamus menggunakan header HTTP Link: dengan jenis rel=compression-dictionary:

Jika klien mendukung kompresi kamus Brotli, tetapi belum meng-cache kamus bersama, browser akan mendownload kamus ini selama waktu tidak ada aktivitas. Respons kamus menyertakan header respons Use-As-Dictionary yang memberi tahu browser resource yang dapat menggunakan kamus ini:

Kamus akan menggunakan semantik cache-control standar dan akan tersedia untuk semua resource yang cocok dengan aturan yang ditentukan dalam header tersebut—dalam contoh ini, halaman dimulai dengan /search.

Untuk pemuatan halaman hasil penelusuran mendatang, browser dapat memberi tahu server bahwa browser memiliki kamus menggunakan header permintaan HTTP Available-Dictionary. Memuat ulang halaman akan menunjukkan cara kerjanya:

Dengan mengaktifkan kotak centang Preserve log dan memfilter, kita dapat membandingkan kedua respons tersebut:

Dalam contoh ini, permintaan pertama adalah respons lengkap 107 kB dan menggunakan kompresi Brotli (br), sedangkan permintaan pemuatan ulang kedua hampir setengah ukurannya, yaitu 60 kB, dan menggunakan kompresi Brotli yang Dikompresi Kamus (dcb), sehingga menghasilkan waktu download yang lebih cepat.

Di Chrome, Anda dapat melihat halaman chrome://net-internals/#sharedDictionary untuk melihat Kamus Bersama dan menghapusnya jika ingin mengulangi contoh ini dari awal.

Hasil

Perubahan ini diluncurkan kepada pengguna Penelusuran pada musim semi 2025, awalnya untuk pengguna Chrome. Hal ini mengurangi ukuran rata-rata payload HTML di semua pengguna Chrome sebesar 23% dibandingkan dengan kompresi Brotli standar. Rata-rata keseluruhan ini mencakup hasil yang tidak dikompresi kamus (misalnya pengguna pertama kali tanpa kamus), dan hasil penelusuran yang dikompresi kamus. Untuk hasil yang dikompresi kamus, penghematannya bahkan lebih besar—seperti yang kita lihat dengan peningkatan hampir 50% pada contoh sebelumnya yang kita lihat.

Hal ini menghasilkan peningkatan Largest Contentful Paint (LCP) sebesar 1,7% secara keseluruhan, dan hingga 9% pada jaringan dengan latensi tinggi. Hal ini mungkin tampak kecil, tetapi Google Penelusuran adalah situs yang dioptimalkan secara hiper, sehingga peningkatan sebesar ini sangat besar. Situs lain mungkin akan melihat peningkatan yang lebih besar dengan teknologi ini.

Coba di situs Anda.

Compression Dictionary Transport kini siap digunakan di semua browser berbasis Chromium (Chrome, Edge, Opera, dan sebagainya). Ini adalah peningkatan progresif yang akan diabaikan oleh browser yang tidak mendukung, tetapi karena semakin banyak browser yang mendukungnya, browser tersebut juga dapat memperoleh manfaat.

Tantangan yang diatasi teknologi ini tidak hanya khusus untuk Google Penelusuran. Banyak situs dapat memanfaatkan Transpor Kamus Kompresi, baik dengan kamus terpisah seperti yang digunakan Penelusuran, atau dengan menggunakan resource yang ada sebagai kamus (seperti versi aplikasi sebelumnya saat meluncurkan versi baru).

Lihat panduan di MDN untuk mengetahui detail selengkapnya tentang cara kerja teknologi ini dan cara menerapkannya di situs Anda.

Hal ini memerlukan beberapa penyiapan di server atau proses build Anda untuk membuat resource terkompresi berbasis kamus dan menayangkannya sebagaimana mestinya—tetapi hasilnya bisa sangat mengesankan dalam hal performa.