Comprimarea Brotli: o alternativă rapidă la compresia GZIP

Publicat: 2022-04-22

Viteza este importantă pentru orice site web. În căutarea de către web a timpilor de încărcare rapid, avem o serie de tehnologii diferite care ne ajută. O abordare este de a minimiza codul de bază pe care site-ul dvs. îl va folosi fără a afecta modul în care funcționează. Comprimarea GZIP este o modalitate de a face acest lucru, dar compresia Brotli este o metodă alternativă, care atrage atenția.

Este o soluție dezvoltată de Google care încearcă să ofere o serie de beneficii față de (precum și o alternativă la) compresia GZIP. Detaliile din acest articol vor intra în exact ceea ce oferă tehnologia, dar compresia Brotli este rapidă și eficientă - ceea ce bifează toate căsuțele de care aveți nevoie pentru a o investiga.

Pentru acest tutorial, vom analiza compresia Brotli și vă vom arăta cum să verificați dacă site-ul dvs. îl folosește și cum să o activați dacă este necesar. Mai întâi, vom plasa Brotli în spațiul algoritmului de compresie și vom vorbi despre motivul pentru care ai dori să-l folosești față de alte soluții.

Comprimarea datelor pentru web

În forma sa cea mai de bază, compresia datelor preia codul pentru un site web sau o aplicație și minimizează dimensiunea fișierului. Acest lucru vă oferă fișiere mai ușoare pentru a vă deplasa pe web și reduce timpul necesar pentru încărcare și redare a unui site web. Veți descoperi că există o mulțime de moduri de a comprima datele, în funcție de tipul de fișier cu care lucrați.

O abordare comună este „minificarea”. Aici un algoritm dezlipește codul site-ului dvs. de unele dintre elementele sale superflue. Ideea este că aspecte precum indentări, comentarii, spații albe și altele vor crește dimensiunea fișierelor și, prin urmare, timpii de încărcare.

Ești gata să te uiți la compresia Brotli și să vezi cum să o activezi pe propriul tău site? Răspunsurile sunt aici Click pentru a Tweet

Eliminarea acestor elemente nu afectează experiența utilizatorului (UX) în majoritatea situațiilor. Cu toate acestea, face lucrurile mai simple pentru computerele care trebuie să compileze și să redea codul. De exemplu, luați această suită de coduri:

 define( 'WP_INSTALLING', true ); /** Sets up the WordPress Environment. */ require __DIR__ . '/wp-load.php'; require __DIR__ . '/wp-blog-header.php'; if ( ! is_multisite() ) { wp_redirect( wp_registration_url() ); die(); } $valid_error_codes = array( 'already_active', 'blog_taken' );

Codul de mai sus folosește elemente precum spații și întoarceri de transport pentru a-l face lizibil de către om, dar un computer nu are nevoie de acestea pentru a înțelege codul de bază. În plus, aceste loturi de spații albe și întreruperi de linie vor ocupa spațiu prețios care, eliminate, vă poate oferi un spor de performanță.

Dacă minimizați acest cod, arată complet diferit:

 define( 'WP_INSTALLING', true ); /** Sets up the WordPress Environment. * / require __DIR__ . '/wp-load.php'; require __DIR__ . '/wp-blog-header.php'; if ( ! is_multisite() ) { wp_redirect( wp_registration_url() ); die(); } $valid_error_codes = array( 'already_active', 'blog_taken' );

Cu toate acestea, fundamentele a ceea ce face acest cod sunt încă aceleași.

Veți descoperi că alte tipuri de fișiere au modalități de comprimare a datelor. De exemplu, imaginile necesită adesea multă compresie pentru a reduce dimensiunea, fără o degradare prea mare a imaginii în sine:

Instrumentul de optimizare a imaginii ShortPixel care afișează un număr de miniaturi de imagine cu valori pre- și post pentru compresia datelor. Există un buton roșu pentru a permite utilizatorului să descarce imaginile ca fișier ZIP.
Un exemplu de imagine optimizată.

Comprimarea GZIP este o modalitate standard de a minimiza dimensiunea pachetelor de fișiere - gândiți-vă la pachete precum pachetele ZIP sau Linux .tar . Dar până acum nu existau alternative reale. Vom vorbi mai multe despre motivul pentru care ar trebui să existe o alternativă mai târziu, dar mai întâi să vă prezentăm „concurentul” GZIP.

Compresie Brotli

Pe scurt, Broti este un algoritm de compresie a datelor. Totuși, dacă asta este tot ce am avea de spus, nu ar exista niciun motiv să investigăm.

Oferă compresie „fără pierderi” și este dezvoltat de Google sub o licență MIT. Compania este adesea în fruntea tehnologiei de avansare a web-ului, așa că nu este surprinzător că Brotli caută să ia ceea ce face GZIP, să-l îmbunătățească și să ofere o experiență îmbunătățită utilizatorilor și site-urilor.

Comprimarea Brotli utilizează aceleași tehnologii de bază de bază ca și compresia GZIP, și anume:

  • Algoritmul LZ77
  • Codificare și decodare Huffman

De fapt, dacă combinați aceste două tehnologii, obțineți formatul DEFLATE care servește drept bază atât pentru compresiile GZIP, cât și pentru Brotli. Este ceva în care intrăm cu o profunzime extremă în postarea noastră despre compresia GZIP.

Pe scurt, fișierele necomprimate rulează prin algoritmii LZ77 și Huffman ca parte a procesului DEFLATE pentru a le comprima într-un format Brotli. De acolo, un proces INFLATE va decomprima din nou fișierele atunci când este necesar.

Deși Brotli este în prezent principalul concurent al GZIP, există și alte tehnologii similare care folosesc și DEFLATE . În secțiunea următoare, vom vorbi despre ceea ce îl face pe Brotli să iasă în evidență.

Comprimarea Brotli vs compresia GZIP

După cum am menționat, atât Brotli, cât și GZIP folosesc metoda DEFLATE pentru a comprima (și decomprima) datele. Acest lucru poate deruta mulți oameni, deoarece acest lucru singur nu justifică o schimbare.

Cu toate acestea, Google se bazează pe DEFLATE pentru a oferi tehnici îmbunătățite și pentru a comprima datele la un standard mai mare și mai rapid.

Cum folosește Brotli dicționarele pentru a îmbunătăți compresia datelor

Un aspect tehnic al formatelor de compresie a datelor este modul în care compresia Brotli utilizează limbajul și textul cunoscut existent în dicționarele de date pentru a-și folosi algoritmul.

Dezvoltatorii vor folosi un dicționar de perechi cheie-valoare pentru a stoca date, deoarece este eficient, flexibil și scalabil. Iată cum ar arăta un dicționar PHP (numit „matrice”):

 $cats = get_categories( array( 'taxonomy' => 'link_category', 'hierarchical' => 0, 'include' => $link_cat, ) );

În timp ce GZIP nu folosește dicționare, Brotli folosește două .

Dicţionar static al lui Brotli

Primul este un dicționar static (adică predefinit) de termeni de cod obișnuiți care acționează ca referință pentru textul HTML, CSS și JavaScript.

Există peste 13.000 de cuvinte în șase limbi diferite, iar Brotli le va folosi ca referințe la punctele din cod. Nu este o analogie exactă, dar este similară modului în care un cârlig WordPress face referire la o suită mai mare de cod.

Ca atare, codificatorul nu trebuie să parcurgă codul octet cu octet. În schimb, poate acționa asupra referințelor, poate extrage definiția din dicționar și trece la următoarea.

Veți găsi, de asemenea, că în dicționar există expresii din lumea reală, precum și coduri care nu ar vedea adesea compresie. Acest lucru ajută unele etichete, cum ar fi <HTML> și parametri precum type="text/javascript" să ia o anumită compresie și să vă ofere câteva câștiguri mai mari.

Există, de asemenea, câteva „transformări” în dicționar: parțial, incomplet și alte tipuri de expresii care, cu un nou prefix, sufix sau caz, devin un cuvânt complet nou - de exemplu, „Work” se transformă în „Working” sau „html”. ” la „HTML”.

Dicţionarul dinamic al lui Brotli

Dicționarul dinamic analizează conținutul și codul la sursă, ceea ce este bun pentru dispozitivele mai mici, dar nu atât de bun pentru fișierele mai mari. Se mai numește și „fereastră glisantă” și poate avea o dimensiune de până la 16 MB. Aici algoritmul de compresie „memorează în cache” unele dintre cele mai recente date pentru a le face referire. Este ultra-dinamic prin faptul că se schimbă constant.

Dacă comparați acest lucru cu fereastra glisantă GZIP de aproximativ 32 KB, veți vedea că posibilitățile de analiză și compresie în timp real sunt uriașe. De fapt, majoritatea practicilor tipice folosesc o fereastră glisantă Brotli de aproximativ 4 MB, care este încă mamut în comparație cu algoritmii concurenți.

Comprimarea Brotli vs compresia GZIP: performanță și suport

Când vine vorba de numere de utilizator pur, compresia GZIP este încă numărul unu. Cu toate acestea, compresia Brotli se folosește mai mult în fiecare zi. Acest lucru se datorează în parte măsurilor adoptive mai largi ale browserelor majore; ascensiunea browserelor bazate pe Chromium ajută de asemenea.

Site-ul web Can I Use... înregistrează ce tehnologii adoptă browserele și oferă un fel de istoric. Acest site notează că peste 95% dintre browsere utilizează compresia Brotli la scrierea curentă, inclusiv toate versiunile majore.

Site-ul web Can I Use... care arată ce versiuni ale tuturor browserelor majore utilizează compresia Brotli. Există o mulțime de casete verzi, care indică faptul că un browser folosește tehnologia, și unele roșii (care denotă că nu o folosește).
Site-ul Can I Use... care arată adoptarea lui Brotli.

În articolul nostru de compresie GZIP, am observat un test de referință în care Brotli a avut un raport de compresie mai bun în comparație cu algoritmii concurenți, dar a rămas în urmă în timp de compresie și decompresie:

O diagramă cu bare care arată formatele de compresie Brotli, BZIP2, GZIP și XZ, în comparație cu testele de referință privind raportul de compresie, timpul de compresie și timpul de decompresie.
O comparație a performanței compresiei între un număr de algoritmi diferiți (Sursa: OpenCPU).

Cu toate acestea, testele Squash Benchmark arată o poveste diferită - una care este mai nuanțată. Adevărata concluzie este că, în general, Brotli este mai flexibil decât GZIP, cu un raport de compresie în general mai mare.

Iată rezumatul constatărilor Squash Benchmarks:

  • Brotli are un raport de compresie mai bun (adică produce fișiere comprimate mai mici) pentru fiecare nivel de compresie.
  • În timp ce GZIP îl învinge pe Brotli în viteză în cea mai mare parte a timpului, nivelul pe care îl comprimați influențează rezultatele pe care le veți vedea.

Defalcarea lui Paul Calvano oferă mai multe detalii, dar esențialul este că Brotli are nevoie de mai multă putere CPU pentru a oferi un factor mai mare de compresie a fișierelor. Aceasta se afișează atât la nivelul cel mai înalt, cât și la cel mai scăzut nivel de compresie. Evaluarea comparativă a Cloudflare susține acest lucru: fișiere mult mai mici, cu numere comparative mai apropiate ale vitezei de compresie.

De asemenea, luați în considerare că unele instrumente de testare, cum ar fi Pingdom și unele rețele de livrare de conținut (CDN) nu acceptă Brotli încă. Acest lucru poate modifica datele colectate de alții despre modul în care funcționează Brotli. Puteți vedea „negative false” dacă executați teste: cifre de viteză mai mare a paginii care ignoră compresia fișierelor pe care o utilizați.

Beneficiile compresiei Brotli

Până acum sunt multe informații de luat în considerare despre compresia Brotli. Cu toate acestea, putem rezuma ceea ce trebuie să știți despre motivul pentru care ar trebui să alegeți Brotli în locul GZIP:

  1. Este nevoie de aceeași tehnologie pe care o folosește GZIP și o îmbunătățește cu metode moderne.
  2. Analiza bazată pe dicționar de la Brotli înseamnă că poate comprima mai multe fișiere la un nivel mai profund.
  3. În timp ce Brotli are nevoie de mai multă putere de calcul în comparație cu GZIP, rezultatele înseamnă fișiere mai mici.
  4. La nivelurile de compresie pe care le folosesc majoritatea gazdelor web – ceva de nivel mediu, cum ar fi nivelul patru sau cinci – Brotli are performanțe mai bune decât GZIP fără a transpira.
  5. Veți descoperi că Brotli are suport aproape universal în toate browserele, dacă nu unele dintre instrumentele de referință cu care sunteți obișnuit.
  6. Brotli este liber de utilizat și open source. Acesta este un avantaj dacă utilizați un CDN compatibil Broti, cum ar fi Cloudflare.

Este de remarcat faptul că Cloudflare folosește compresia Brotli pe toate serverele sale. De fapt, folosește o versiune modificată și optimizată a Brotli pentru a vă oferi câștiguri suplimentare în ceea ce privește viteza și livrarea fișierelor.

Deoarece Kinsta oferă integrarea Cloudflare pe toate planurile, fiecare site găzduit folosește Brotli în mod implicit. Acesta este doar unul dintre motivele pentru care Kinsta este unul dintre cei mai buni furnizori de găzduire de pe piață.

Cum să verificați dacă site-ul dvs. utilizează compresia Brotli

Deoarece compresia Brotli nu este încă standard (deși este aproape acolo), probabil că veți dori să știți dacă site-ul dvs. o folosește. Există câteva modalități de a înțelege acest lucru.

1. Utilizați un instrument online

Cel mai simplu mod de a verifica dacă site-ul tău folosește compresia Brotli este printr-un instrument online. Deși există câteva dintre care să alegeți, veți dori ceva rapid și simplu de utilizat, care vă va oferi și o mulțime de informații despre configurarea dvs.

Gift of Speed ​​este alegerea noastră pentru a verifica compresia Brotli.

Verificatorul Gift Of Speed ​​Brotli, care arată că site-ul web Google utilizează compresia Brotli și afișează valori precum dimensiunea paginii, procentul de compresie și date despre starea HTTP a site-ului.
Site-ul web Gift of Speed.

Acesta va determina dacă site-ul dvs. folosește GZIP, Brotli sau nicio compresie și va oferi alte câteva valori pentru a vă ajuta să decideți ce să faceți în continuare. Aceste valori oferă o perspectivă importantă, deoarece nu doriți doar să luați în considerare dacă serverul site-ului dvs. folosește „aroma” potrivită de compresie.

Există o mulțime de elemente care alcătuiesc un site web și chiar biblioteci și dependențe terță parte. Puteți alege să le serviți folosind un CDN și, dacă da, aceasta trebuie să folosească și compresia Brotli pentru cea mai bună performanță posibilă.

Dacă utilizați Gift Of Speed ​​pentru a testa active individuale, puteți arunca o privire la valoarea Server pentru a vedea cum este servit.

O pagină cu rezultate parțială Gift of Speed ​​care arată o încărcare a activelor de pe un server Cloudflare, împreună cu valorile privind nivelul de compresie Brotli aplicat și starea HTTP a testului.
Pagina de rezultate Gift Of Speed ​​pentru un activ Cloudflare.

Toate site-urile Kinsta folosesc CDN-ul Kinsta alimentat de Cloudflare. Ca atare, fiecare site va folosi, de asemenea, compresia Brotli de-a lungul întregului lanț și arhitectură a serverului.

2. Verificați Utilizarea instrumentelor de dezvoltare ale browserului dvs

Majoritatea dezvoltatorilor vor ști că un browser oferă câteva instrumente fantastice pentru a vă ajuta cu tot felul de investigații și depanare legate de web. O verificare rapidă pe care o puteți face este dacă site-ul dvs. (sau un activ specific) utilizează compresia Brotli.

Pentru toate browserele majore, cum ar fi Brave, Edge, Firefox sau Chrome, puteți accesa ecranul Rețea > Toate .

La început, nu veți vedea nimic legat de anteturile de conținut – va trebui să selectați un material sau o solicitare din partea stângă. Dacă continuați să căutați și să derulați în jos în listă, veți vedea un panou care se deschide, care este implicit la informațiile Antet .

Aici, derulați în jos rezultatul până când vedeți content-encoding: br :

Instrumentele de dezvoltare ale browserului web Brave care arată o listă de active în partea stângă (cu
Instrumentele de dezvoltare ale Brave, care arată că compresia Brotili este activată pentru site.

Pe scurt: dacă vedeți content-encoding: br , aceasta vă spune că Brotli este activ pentru site-ul respectiv.

Te lupți cu timpii de nefuncționare și problemele WordPress? Kinsta este soluția de găzduire concepută pentru a vă economisi timp! Verificați caracteristicile noastre

Cum să activați compresia Brotli pentru site-ul dvs

În aceste câteva secțiuni finale, vă vom arăta o serie de moduri diferite de a activa compresia Brotli pentru site-ul dvs. Prima va fi abordarea pe care o recomandăm pentru majoritatea site-urilor WordPress care nu folosesc Kinsta – iar ultima este cea pe care o recomandăm pentru fiecare site care citește prima abordare!

1. Utilizați un plugin WordPress

Aproape fiecare site WordPress va folosi cel puțin un plugin - adesea mai mult în funcție de funcționalitatea de care are nevoie site-ul. Memorarea în cache este un caz de utilizare pentru pluginuri și există multe în jur. Cu toate acestea, nu toate vă vor permite să activați compresia Brotli, așa că va trebui să alegeți cu înțelepciune și să fiți pregătit să schimbați soluția preferată.

Înainte de a efectua orice modificare a unui site, nu uitați să faceți o copie de rezervă completă în cazul în care trebuie să faceți o restaurare mai târziu. Pentru această metodă, vom folosi W3 Total Cache, deoarece este simplu să găsiți setarea potrivită.

Va trebui să mergeți la pagina Performanță > Cache browser din WordPress:

Tabloul de bord WordPress, care arată
W3 Total Cache „Browser Cache: link.

Acest ecran arată două setări. Cea pe care veți dori să-l alegeți este Enable HTTP (brotli) Compression :

Cache-ul total W3
Activarea compresiei Brotli în W3 Total Cache.

Cu toate acestea, acest lucru nu va fi potrivit pentru fiecare site și situație. De exemplu, Kinsta își optimizează serverul pentru găzduire rapidă, de înaltă performanță și de încredere. Ca atare, există o serie de plugin-uri de care nu veți avea nevoie, iar altora chiar li se interzice utilizarea pe site-urile Kinsta.

În aceste cazuri, veți dori să adoptați o altă abordare.

2. Activați Brotli pe server

Când vine vorba de alegerea unui tip de server, Nginx vs Apache este o bătălie de lungă durată pe care (deocamdată) primul o câștigă. Indiferent, ambele tipuri de servere pot activa compresia Brotli și există abordări diferite pentru fiecare.

Înainte de a analiza abordarea manuală, există câteva condiții preliminare pe care ar trebui să le cunoașteți:

  • Veți dori să înțelegeți cum să accesați fișierele de configurare pentru serverul dvs. specific.
  • Cunoașterea liniei de comandă va fi benefică, mai ales când vine vorba de servere Apache. Pentru a rula orice comandă, va trebui să fii un utilizator root cu privilegii sudo .
  • S-ar putea să aveți nevoie de un editor de text, dar pentru modificări rapide, cum ar fi acesta, ar trebui să fie bine.
  • În unele cazuri, veți avea nevoie de acreditările dvs. de conectare ca utilizator SSH (secure shell) pe serverul însuși. Le puteți găsi în panoul de control al găzduirii sau contactați asistența pentru a cere.

Dacă aveți îndoieli cu privire la abordarea manuală, vă recomandăm să căutați o altă opțiune sau să contactați gazda pentru ajutor. Indiferent, vom oferi pe rând o scurtă prezentare generală a procesului pentru fiecare server, începând cu Nginx.

Nginx

Pentru a activa compresia Brotli pe serverele Nginx, mai întâi va trebui să găsiți fișierul nginx.conf . Va fi una dintre câteva locații:

  • /usr/local/nginx/conf
  • /etc/nginx
  • /usr/local/etc/nginx

Când aveți fișierul deschis, adăugați următoarele în partea de jos:

 brotli on; brotli_static on; brotli_comp_level 9; # You can change this from 1–11. 4–9 offers good performance balance. brotli_types text/plain text/css application/javascript application/json image/svg+xml application/xml+rss;

Această suită va porni Brotli și o va folosi pentru a servi fișiere statice. Setarea brotli_comp_level este una pe care o puteți modifica în funcție de cazul dvs. de utilizare și de nevoi. Cifrele mai mari oferă o compresie mai bună echilibrată cu un site mai puțin performant.

Apache

Deoarece Apache este flexibil când vine vorba de configurații, puteți activa compresia Brotli fără prea multă agitație.

Pentru a face acest lucru, urmați acești pași:

  1. Conectați-vă la server folosind un prompt de comandă sau o aplicație Terminal, ca utilizator root sudo .
  2. Rulați comanda a2enmod brotli pentru a activa compresia.
  3. În configurația Apache VirtualHost sau a serverului dvs., adăugați linia AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/css text/javascript application/javascript pentru a seta tipurile de fișiere potrivite pe care doriți să le comprimați.

Deși Apache nu acceptă compresia statică, puteți modifica nivelul de compresie Brotli pe care îl oferiți folosind linia BrotliCompressionQuality LEVEL-NUMBER . Cu toate acestea, va trebui să înlocuiți locul de rezervă „LEVEL-NUMBER” cu un număr între 1–11.

3. Utilizați o gazdă web de asistență

Cel mai simplu mod de a activa compresia Brotli pentru site-ul dvs. este să vă asigurați că gazda face acest lucru în mod implicit. Kinsta oferă compresie Brotli ca standard datorită integrării sale cu CDN-ul Cloudflare.

Un desen al unei stive de server cilindrice albastre, în fața unei sfere albastre înconjurate de inele subțiri portocalii, conectate la sferă cu puncte.
Pagina CDN a lui Cloudflare.

Kinsta CDN este alimentat de infrastructura Cloudflare pentru toate planurile - astfel încât fiecare site folosește compresia Brotli fără a fi nevoie să o activați.

Veți dori să verificați dacă gazda aleasă oferă compresie Brotli și la ce nivel trebuie să o configurați. Pentru a rula cel mai performant, stabil și sigur site, este esențială o bună găzduire.

Aflați cum să verificați dacă site-ul dvs. folosește compresia Brotli, cum să o activați (dacă aveți nevoie!) și explorați de ce ați dori să-l utilizați față de alte soluții. Faceți clic pentru a trimite pe Tweet

rezumat

Comprimarea datelor este o componentă necesară a dezvoltării și utilizării web-ului modern. Dimensiunile fișierelor pot crește vertiginos datorită tipurilor de fișiere bogate și complexe pe care le veți folosi pentru a crea un site web. Toate au nevoie de o formă de compresie.

Abordarea tipică a fost GZIP până acum, dar există un copil nou la bloc.

Compresia Brotli își bazează tehnologia pe aceeași bază ca GZIP, dar include câteva beneficii de îmbunătățire a performanței. După cum am discutat, folosește maparea contextului pentru a procesa o solicitare de compresie mai rapid și un dicționar care utilizează populație dinamică. Acesta este mult mai mare decât ceea ce poate oferi GZIP și, de asemenea, permite utilizatorilor de telefonie mobilă să beneficieze și de compresie.

Vestea bună este că fiecare site Kinsta poate beneficia de compresia Brotli datorită integrării noastre unice Cloudflare. Aceasta înseamnă că site-ul dvs. găzduit de Kinsta este mai rapid decât concurența folosind GZIP și se încarcă rapid pentru cei de pe dispozitive mai mici.

Ai întrebări despre compresia Brotli? Simțiți-vă liber să întrebați în secțiunea de comentarii de mai jos!