A tömörítés az az eljárás, amellyel a szerver átvitel előtt összecsomagolja a szöveges válaszokat, a böngésző pedig kicsomagolja őket. A weben két algoritmus számít: a régebbi gzip és az újabb, hatékonyabb Brotli.
Hogyan működik
A böngésző minden kéréshez küld egy Accept-Encoding fejlécet. Ebben felsorolja, mit tud kicsomagolni: jellemzően gzip, deflate, br, zstd. A szerver ebből választ, és a válaszban Content-Encoding: br vagy Content-Encoding: gzip fejléccel jelzi a döntését. Ha ilyen fejléc nincs, a válasz tömörítetlenül utazik a hálózaton.
A nyereség szöveges fájloknál nagy. Egy tipikus HTML-, CSS- vagy JavaScript-állomány 70-85 százalékkal zsugorodik. A Brotli azonos tartalmon általában 15-20 százalékkal kisebb eredményt ad, mint a gzip. Képeknél és videóknál viszont nincs mit nyerni, mert azok formátuma eleve tömörített.
Mit jelent a keresőknek és az AI-nak
A keresőrobotok és az AI-crawlerek ugyanúgy küldik az Accept-Encoding fejlécet, mint a böngészők. Kisebb átvitel gyorsabb letöltést jelent, ez pedig több lekért oldalt ugyanannyi idő alatt. A tartalom nem változik tőle, tehát ez nem rangsorolási trükk. A TTFB (Time to First Byte) értékét sem javítja magától, sőt élő tömörítésnél pár ezredmásodperccel ronthatja is.
Mikor számít igazán
Akkor, ha nagy az HTML-méret, vagy sok script és stíluslap tölt be. Mobilneten és gyenge kapcsolaton minden megspórolt száz kilobájt látható. A riportokban azt látjuk, hogy ma már a magyar oldalak többségén be van kapcsolva valamilyen tömörítés. A hiány jellemzően régi, saját kezelésű VPS-eken bukkan fel.
Röviden: a tömörítés olcsó, egyszer beállítható nyereség, de nem javítja ki a felesleges kódot.
Technikai példa
Ellenőrzés parancssorból. A curl kifejezetten kéri a Brotli és gzip támogatást, majd csak a válaszfejléceket írja ki:
curl -sI -H "Accept-Encoding: gzip, deflate, br" https://pelda.hu/
# Elvárt válasz (részlet):
# HTTP/2 200
# content-type: text/html; charset=UTF-8
# content-encoding: br
# vary: Accept-Encoding
Ha a content-encoding sor hiányzik, nincs tömörítés. A vary: Accept-Encoding fejléc azért kell, hogy a köztes cache-ek ne adják oda a tömörített választ egy olyan kliensnek, amelyik nem kérte.
Tipikus nginx-beállítás. A gzip_comp_level 6 jó kompromisszum sebesség és méret között:
gzip on;
gzip_comp_level 6;
gzip_min_length 1024;
gzip_vary on;
gzip_types text/plain text/css application/javascript application/json image/svg+xml application/xml;
location ~* \.(css|js)$ {
brotli_static on;
gzip_static on;
}
Az 1024 bájtos alsó küszöb azért hasznos, mert nagyon kis fájloknál a tömörítés többe kerül, mint amennyit hoz. A brotli_static és gzip_static a build során előre elkészített .br és .gz fájlokat szolgálja ki.
Gyakori kérdések
Melyiket válasszam, gzipet vagy Brotlit?
Mindkettőt kapcsold be egyszerre. A szerver a kliens Accept-Encoding fejléce alapján dönt, így a modern böngészők Brotlit kapnak, a régi kliensek gzipet. Ez nem választás kérdése, hanem tartalék-mechanizmus.
Mennyit gyorsul ettől az oldal?
Függ attól, mekkora szöveges tartalmat töltesz le. Egy 300 kB-os HTML esetén 200-250 kB megtakarítás reális, ami lassú mobilneten akár egy másodperc. Gyors kapcsolaton a különbség sokkal kisebb, néhány száz ezredmásodperc.
Rontja a tömörítés a szerver teljesítményét?
Közepes szinten alig érezhető a terhelés. Maximális tömörítési szintnél viszont már számottevő a CPU-használat minden egyes kérésnél. Statikus fájlokat ezért érdemes előre tömöríteni, és csak a dinamikus HTML-t csomagolni futás közben.
Ha van CDN-em, kell a szerveren is tömörítés?
Igen. A CDN gyorsítótár-tévesztéskor az origin szerverről kéri le a tartalmat, és ilyenkor az eredeti válasz mérete számít. A két réteg nem zárja ki egymást, csak arra ügyelj, hogy ne tömörítsenek egymás után kétszer.
Honnan tudom, hogy a keresőrobot is tömörítve kapja meg az oldalt?
A robotok is küldik az Accept-Encoding fejlécet, tehát ugyanazt kapják, amit a böngésző. A Search Console feltérképezési statisztikáiban láthatod az átlagos letöltési méretet és válaszidőt. Ha a tömörítés bekapcsolása után csökken az átlagos méret, a beállítás él.
