Apa Itu Brotli ?

Brotli adalah algoritma kompresi yang dikembangkan oleh dua teknisi dari Google. Brotli sengaja diciptakan untuk membuat halaman website bisa diakses lebih cepat.

Dengan teknik kompresi ini, file data menjadi berukuran lebih kecil sehingga menghemat penggunaan data saat komunikasi data terjadi. Kondisi tersebut juga membuat proses transfer data bisa berjalan lebih baik.

Jika akses ke halaman website bisa lebih cepat, pengunjung website tidak perlu menunggu terlalu lama sehingga kenyamanan bisa ditingkatkan.

Pada awalnya, Brotli dibuat untuk melakukan kompresi web font secara offline di tahun 2013. Kemudian, di tahun 2015, Google mengembangkannya sebagai teknik kompresi data secara umum (generic purpose) dan bersifat open source.

Brotli adalah open source, algoritma kompresi data lossless dengan kepadatan kompresi yang lebih baik daripada gzip yang mengurangi konsumsi bandwidth dan membantu memuat konten lebih cepat. 

Secara teknis, Brotli menggunakan kombinasi dari algoritma LZ77, Huffman coding, dan 2nd order context modeling. Kombinasi ini memungkinkan Brotli membuat backreferences dengan sliding window (bukan fixed window ala Gzip). Hasilnya, upaya kompresi file besar pun dapat berjalan dengan lebih baik dengan peningkatan hingga 25%.

Google menyebut Brotli sebagai format data baru yang mampu mengalahkan algoritma Zopfli hingga 26%. Tidak hanya lebih baik, Brotli mampu melakukannya dalam waktu yang lebih singkat.

Saat ini sudah banyak browser dan server yang mendukung Brotli karena performa handal yang mampu dihadirkannya. Sampai saat ini, ada beberapa browser yang juga mendukung Brotli :

1. Chrome mendukung brotli sejak versi 49.
2. Microsoft Edge akan mulai mendukung brotli sejak versi 15.
3. Firefox sudah mengimplementasikan brotli sejak versi 44.
4. Opera sudah mendukung brotli sejak versi 36.

Cara Kerja Brotli

Seperti halnya kegiatan browsing yang biasa dilakukan, pada saat pengguna mengetikan sebuah alamat website, pada dasarnya pengguna meminta akses ke server website tersebut :

1. Jika browser sudah mendukung kompresi Brotli, browser akan menginformasikan jenis konten yang bisa di decompress menggunakan header Accept Encoding kepada server tersebut.
2. Server akan menentukan jenis kompresi konten yang akan dikirimkan dengan algoritma kompresi yang diminta, dalam hal ini Brotli.
3. Tahapan tersebut diikuti oleh proses pengiriman data menggunakan header Content-Encoding ke browser, tentu saja dengan teknik kompresi Brotli.
4. Browser akan menampilkan konten yang diminta oleh pengguna dengan terlebih dahulu melakukan decompress data.

Manfaat Brotli Bagi Website

Kemampuan kompresi yang baik dari Brotli akan mendukung performa website.

File yang melewati proses kompresi akan menjadi lebih kecil. Jadi, akan menghemat banyak bandwidth saat komunikasi data dilakukan. Bandwidth yang kecil akan membuat website mampu loading lebih cepat.

Kecepatan website itu penting karena pelanggan tidak mau menunggu lama. Menurut survey, pengunjung hanya bersedia menunggu selama 3 detik sebelum beralih ke website lain.

Tidak hanya itu, website yang lambat hanya akan menyebabkan kehilangan kesempatan menjual produk lebih banyak. Menurut sebuah data delay loading selama 1 detik bisa menurunkan conservation rate hingga 7%.

Cara Mengecek Brotli

Cukup mudah untuk mengecek dukungan Brotli dari sebuah browser. Di contoh ini dengan menggunakan Firefox.

Masuk ke menu Settings di sebelah kanan atas, lalu pilih Web Developer.

Kemudian bisa masuk ke menu Network.

Di bagian Network, maka akan menemukan Accept Encoding di bagian Request Header. Jika sudah mencakup br, artinya sudah mendukung Brotli.

Selain browser, server yang dituju juga harus mendukung kompresi menggunakan Brotli. Jadi, pastikan layanan hosting menggunakan server yang mendukung Brotli.

Salah satu server yang mendukung Brotli secara default adalah LiteSpeed Server.

Untuk membuktikan dukungan dari Brotli di website, silakan masukkan URL dari website ke tool Brotli Test dari KeyCDN.

Jika hasil di kolom hijau menunjukkan “Brotli compression is supported”, maka artinya kompresi Brotli bisa berjalan dengan baik.

Jika ingin melakukan pengecekan dari browser, bisa masuk ke bagian Network pada menu Developer. Persis seperti cara di atas ketika menggunakan Firefox.

Bedanya bisa mencari Content-Encoding pada bagian Response Header. Jika tertulis br, berarti sudah mendukung Brotli dengan baik.

Kelebihan Brotli

Secara umum, semua teknik kompresi bertujuan untuk membuat akses ke website menjadi lebih cepat. Dengan proses transfer data yang efisien, proses loading halaman tak akan memakan waktu lama.

Berikut ini adalah beberapa kelebihan brotli, yaitu :

1. File Kompresi Lebih Kecil (Brotli vs Gzip)

Berbicara algoritma kompresi, Gzip lebih dulu digunakan dan mampu menawarkan performa kompresi yang tidak tertandingi. Tapi, itu sebelum adanya Brotli.

Dari sebuah tes, Brotli memberikan hasil kompresi lebih kecil dibandingkan Gzip. Hasil kompresi lebih kecil ditunjukkan pada  JavaScript (14%), HTML (21%) dan CSS (17%).

Lebih jauh, pengujian lain dilakukan untuk mengetahui performa Brotli vs Gzip pada platform WordPress. Inilah hasilnya dalam bentuk tabel :

Hasil tersebut tentu sangat signifikan mengingat banyak website saat ini memiliki file seperti JavaScript yang berukuran cukup besar. Jadi, tanpa optimasi ini, loading website bisa lama dan menjadi masalah.

2. Waktu Kompresi Lebih Singkat

Selain hasil kompresi, waktu kompresi yang lebih singkat menjadi faktor yang penting dari penggunaan Brotli.

Berdasarkan sebuah pengujian, Brotli terbukti dapat melakukan proses kompresi dengan lebih cepat dibandingkan beberapa algoritma kompresi lain

Bahkan tes yang dilakukan SitePoint di platform WordPress  menunjukkan kompresi Brotli lebih unggul daripada Gzip.  Hasilnya seperti tabel berikut :

Jika mendapatkan hasil sebaliknya, lakukan pengecekan pada setting level of compression.  Secara default, Brotli mengatur tingkat kompresi di level 11 (paling baik) sehingga membutuhkan waktu lebih banyak. Sesuaikan level kompresi ini untuk hasil yang sesuai keinginan.

3. Mendukung Berbagai Browser

Saat ini, hampir semua browser mendukung algoritma kompresi Brotli. Mulai dari browser untuk desktop seperti Firefox dan Chrome hingga browser untuk platform mobile seperti Opera Mini.

Untuk memastikan apakah browser yang digunakan sudah mendukung kompresi Brotli, bisa melakukan pengecekan.

Alasan Harus Menggunakan Brotli

Sederhananya, Brotli lebih efisien daripada gzip. Dengan lebih sedikit data yang ditransfer, dapat mengurangi latensi dan mengurangi biaya Content Delivery Network (CDN). Setelah mengaktifkan kompresi Brotli harus mengharapkan peningkatan ukuran berikut di atas gzip :

• HTML : 21% lebih kecil dari gzip.
• JavaScript : 14% lebih kecil dari gzip.
• CSS : 17% lebih kecil dari gzip.

Catatan :

“Brotli hanya digunakan untuk mengompres file berbasis teks. Format seperti JPEG dan MP4 memiliki algoritma kompresi bawaan dan Brotli sebenarnya akan membuat ukuran file lebih besar daripada aslinya”.