Optymalizacja strony — jak przyspieszyć WordPress za pomocą kompresji Brotli?

Kompresja Brotli w WordPressie a optymalizacja strony

Optymalizacja strony to proces, dzięki któremu można zwiększyć szybkość ładowania się zasobów. Jedną z wykorzystywanych ku temu metod jest wprowadzona na rynek w 1992 r. kompresja GZIP. Technika ta miała w pierwotnym założeniu służyć jako kompresor archiwów tar w systemie operacyjnym Unix, który stał się podwaliną dla bardziej znanych obecnie formatów takich jak Linux czy macOS.

Optymalizacja strony przy użyciu kompresji Brotli

I o ile GZIP jest wciąż używany przez 64.5% witryn korzystających z dowolnego typu kompresji danych (według badań wykonanych przez W3Techs). Tak nowy algorytm opracowany przez Google w 2013 r. – Brotli zdobył już uznanie 36.1% właścicieli stron WWW. Co nie powinno dziwić, jako że metoda ta faktycznie przejawia w pewnych obszarach większą skuteczność od kompresji GZIP.

O tym i poszczególnych różnicach odnoszących się do modułów GZIP i Brotli dowiesz się z poniższego artykułu.

Optymalizacja strony — czym jest i jak działa kompresja Brotli?

Metoda Brotli opiera się do pewnego stopnia na podobnych założeniach, co GZIP i do kompresowania danych używa algorytmu LZ77, kodowania Huffmana oraz modelowania kontekstowego.

Optymalizacja strony – czym jest i jak działa Brotli?

Kompresja zasobów witryny (grafik, treści) pobieranych z serwera pomaga wysłać je do przeglądarki szybciej. A ponieważ rozmiar stron internetowych wciąż rośnie, zwiększa się potrzeba znalezienia rozwiązań, które będą lepiej konsolidować dane. A przez to i ekspresowo dostarczać użytkownikowi końcowemu określoną zawartość.

Obecnie do tego celu służą najczęściej rozwiązania typu GZIP, Brotli oraz DEFLATE, choć tę ostatnią technikę Google, poniekąd deprecjonuje. I o ile inny wprowadzony w 2013 r. algorytm Zopfli, również używany do kompresji danych, jeszcze na DEFLATE bazował. Tak Brotli, jak samo Google zaznacza, otwiera zupełnie inny rozdział w historii.
Ta już teraz pokazuje, iż nowy standard kompresji jest o ok. 20% skuteczniejszy od GZIP, choć posiada również pewne ograniczenia.

Warto wiedzieć: Nazwa: „Brotli” pochodzi od wypieku piekarniczego – szwajcarskich bułek. I w pierwotnym założeniu metoda ta wcale nie miała zwiększać wydajności stron WWW. A jedynie służyć do kompresji czcionek internetowych.

Co odróżnia metody GZIP i Brotli?

Mimo iż obie techniki dokonują bezstratnej kompresji danych, tak nie można pominąć, że to właśnie algorytm Brotli wykazuje lepszą skuteczność.

Szybka kompresja Brotli i GZIP a optymalizacja strony

Dzięki sprawniejszemu konsolidowaniu kluczowych zasobów rzutujących na czas ładowania się zawartości. Dodatkowo należy wspomnieć, iż wskaźnik wydajności kompresji Brotli w porównaniu do GZIP jest w przypadku:

  • HTML – lepszy o 21%;
  • CSS – lepszy o 17%;
  • JavaScript – lepszy o 14%.

Co czyni ten moduł rozwiązaniem bardziej przystosowanym do obecnych potrzeb właścicieli witryn oraz samych odbiorców.

Warto również zauważyć, iż optymalizacja strony przy wsparciu Brotli i GZIP przebiega w różny sposób. A oba rozwiązania charakteryzują pewne poziomy określające stopień skuteczności tych metod. Chodzi tu dokładnie o skalę przeprowadzonej kompresji względem czasu, w jakim dany proces zachodzi.
Dla przykładu:

  • poziom 1 – to niewielka komasacja i szybko zakończona;
  • poziom 11 – to bardziej złożona kompresja trwająca dłużej.

Porównanie tych wartości dla obu algorytmów można zaobserwować poniżej:

Optymalizacja strony a Brotli i GZIP

Powyższy bilans został wygenerowany automatycznie przy użyciu narzędzia Squash. A przy okazji uwidacznia, iż Brotli posiada 11 poziomów, podczas gdy GZIP tylko 9. Ma to znaczenie w przypadku konfiguracji. A dokładniej, gdy chodzi o zachowanie równowagi między rozmiarem kompresji a czasem potrzebnym do sfinalizowania całego procesu. Nie można pozwolić, aby trwało to zbyt długo, jeśli celem jest optymalizacja strony i mamy na względzie użytkownika.

Optymalizacja strony WordPress a kompresja GZIP i Brotli

I o ile mamy już podgląd na to, czym są dane moduły, warto przyjrzeć się im w akcji.

Wydajność metod GZIP i Brotli a optymalizacja strony

W tym celu skorzystamy z pomocy zespołu sitepoint.com, który w ramach testu zaaranżował 3 scenariusze badające wydajność stron WordPress w przypadku kompresji:

  • GZIP;
  • Brotli;
  • Brotli ze wsparciem CDN.

Pomiar został przeprowadzony na czystej instalacji WordPressa pod motywem Twenty Seventeen, który zawiera 14 zasobów oraz waży 236 KB. Zarówno w odniesieniu do Brotli, jak i GZIP ustawiono poziom kompresji na „3”.

Oto jak prezentują się wyniki:

Jak wygląda wydajność Brotli w WordPressie?

Jak można zauważyć zastosowanie Brotli w obu przypadkach zwiększa szybkość strony. A jednocześnie zmniejsza się rozmiar skompresowanej zawartości. Na tej podstawie można śmiało założyć, że w odniesieniu do bogatej w treść witryny te wskaźniki będą odpowiednio większe i jeszcze bardziej imponujące.

Warto dodać, iż, jeśli chcemy samodzielnie sprawdzić, jak wygląda nasza strona w takim zestawieniu możemy do tego celu wykorzystać inny instrument: Kompresja Brotli i GZIP.

Jak sprawdzić wydajność metod Brotli i GZIP?

Pozwala on poznać faktyczną wagę zasobów, rozmiar po zastosowaniu metody GZIP/Brotli (oczywiście, jeśli tych modułów używamy), oraz poziom kompresji, jaki został użyty. Dowiemy się, także, jaką przewagę (zobrazowaną w procentach) posiada Brotli nad GZIP.

Warto wiedzieć: To czy strona korzysta z kompresji Brotli możemy ustalić przy pomocy konsoli programisty.
W tym celu wciskamy prawy przycisk myszy i wybieramy: „Zbadaj”. A następnie szukamy zakładki: „Network” i odświeżamy stronę. Po kliknięciu głównego zasobu w sekcji: „Headers” zobaczymy interesujący nas wskaźnik: „content-encoding”. Jeśli znajdzie się tu oznaczenie: „br” możemy mieć w tej sprawie pewność.

Zastosowanie i ograniczenia Brotli

Jakkolwiek optymalizacja strony za pomocą Brotli posiada szereg zalet, tak nie sposób ukryć, iż używanie tej metody wiąże się również z pewnymi zastrzeżeniami.

Kompresja Brotli a jej ograniczenia

Wynika to bezpośrednio z krótszej dostępności tego rozwiązania na rynku. Co przekłada się na niepełną zgodność lub kompatybilność z różnymi systemami czy mechanizmami.

Można tutaj wymienić takie zależności jak:

  • współpraca wyłącznie ze stronami z protokołem HTTPS. Co z uwagi na obowiązującą od niedawna dyrektywę wprowadzoną przez Google (obniżającą rating adresów WWW bez certyfikatu SSL) nie powinno, jednak stanowić przeszkody ani tym bardziej zaskakiwać;
  • ograniczona obsługa Brotli przez przeglądarki. Większość popularnych wyszukiwarek już dany algorytm rozróżnia. Acz nie jest to jeszcze standard;
  • bardziej wydajne zastosowanie względem statycznych treści. Brotli ciut gorzej radzi sobie z dynamicznymi zasobami;
  • wymóg ręcznej konfiguracji przy nieodpowiednio ustawionym ratio (między rozmiarem a czasem kompresji) może sprawić, że GZIP okaże się szybszy.

W tym ostatnim przypadku warto zauważyć, iż to od prędkości, z jaką kompresowane są zasoby, a potem „odpakowywane” zależy moment, w którym użytkownik zobaczy stronę. Co oznacza, iż należy bardzo uważnie podejść do manipulowania poziomami kompresji Brotli, zachowując optymalny współczynnik.

Sprawdź najszybszy na rynku hosting WordPress oraz hosting Ecommerce.

Jak włączyć kompresję Brotli w WordPressie?

Aby to osiągnąć moduł musi być zaimplementowany na serwerze. Chyba że wspomagamy się gotowymi narzędziami typu CDN. O czym za chwilę.

Warto wiedzieć, iż jeśli korzystasz z zasobów JCHOST możesz już teraz kompresować dane za pomocą Brotli. Jako że od 01.10.2021 r. metoda ta stała się częścią funkcjonalności hostingu.

Niemniej, jeżeli nie mamy wyjścia i musimy moduł zainstalować, możemy w tym celu posiłkować się poniższymi krokami.

Oto jak to zrobić:

1. Instalacja Brotli na serwerze

Zanim zainicjujemy cały proces, warto zweryfikować czy Brotli nie zostało uprzednio wdrożone.

Jak włączyć Brotli na serwerze?

Możemy to ustalić, używając niewielkiego narzędzia: Key CDN.
W widocznym polu wpisujemy adres URL posiadanej strony i czekamy na rezultat.
Jeśli serwer nie kompresuje zasobów za pomocą Brotli, warto przejść do poniższych kroków, które pokażą jak zainstalować moduł dla Nginx.

Oto jak to zrobić:

1. Zaloguj się poprzez SSH do powłoki systemu i wprowadź komendę:

  sudo apt update && sudo apt install brotli   

2. Zainstaluj moduł Nginx do kompresji Brotli. Aby tego dokonać – przejdź do GitHub i poszukaj sekcji: „Installation”. Postępuj wedle instrukcji.

3. Dodaj wytyczne konfiguracji, edytując plik nginx.conf. Dostępne dyrektywy znajdziesz w polu: „Configuration directives”.
Przykładowa konfiguracja uruchamiająca kompresję Brotli dla poziomu 6 może wyglądać tak:

brotli on;
brotli_comp_level 6;
brotli_static on;
brotli_types application/atom+xml application/javascript application/json application/rss+xml
application/vnd.ms-fontobject application/x-font-opentype application/x-font-truetype
application/x-font-ttf application/x-javascript application/xhtml+xml application/xml
font/eot font/opentype font/otf font/truetype image/svg+xml image/vnd.microsoft.icon
image/x-icon image/x-win-bitmap text/css text/javascript text/plain text/xml;   

4. Na koniec zrestartuj Nginx:

sudo systemctl reload nginx  

Po wykonaniu tych operacji serwer powinien obsługiwać Brotli. I aby mieć co do tego pewność możemy jeszcze raz odwołać się do narzędzia Key CDN.

2. Włączenie kompresji przy użyciu wtyczki

Po instalacji Brotli na serwerze nie pozostaje nic innego, jak uruchomić wsparcie dla naszej strony w WordPressie przy użyciu odpowiedniego pluginu.

Jak włączyć Brotli w WordPressie?

Możemy w tym celu posłużyć się wtyczką W3 Total Cache, która posiada tę funkcjonalność.

Aby to zrobić wybieramy z menu: „Browser Cache” i odznaczamy w poszczególnych sekcjach właściwą opcję:

Włączenie Brotli za pomocą wtyczki

To wszystko. Od teraz Twoja strona korzysta z nowego standardu kompresji.

3. Uruchomienie Brotli za pomocą CDN

Aby kompresować zasoby za pośrednictwem Brotli można również sięgnąć po zewnętrzne rozwiązanie, jakim jest Cloudflare.

Jak włączyć Brotli za pomocą Cloudflare?

Jeśli nie mamy jeszcze wdrożonego systemu CDN, staniemy przed właściwą ku temu okazją. A jeśli dodatkowo chcemy dowiedzieć się o danym narzędziu więcej – dobrze będzie zajrzeć tutaj: CDN – co to, jak działa i jakie ma zalety?

Tymczasem, aby mieć pewność, że podpięta pod Cloudflare strona będzie używać Brotli należy przejść do ustawień witryny i kliknąć ikonę: „Speed”.

Jak ustawić kompresję Brotli w systemie CDN?

Tutaj wybieramy zakładkę: „Optimization” i schodzimy w dół do odpowiedniej sekcji.

Optymalizacja strony a Brotli i CDN

Upewniamy się, że kompresja Brotli jest włączona.

Podsumowanie

Kompresja danych jako forma umożliwiająca skrócenie czasu ładowania się strony to element, bez którego nie mogłaby dziś funkcjonować żadna witryna w internecie.

I o ile istnieją metody pozwalające usprawnić proces dostarczania zasobów zainstalowanych na serwerze użytkownikowi końcowemu, tak nie są to techniki doskonałe. I można założyć, że wciąż szuka się optymalnego rozwiązania, którym być może stanie się algorytm Brotli.

O tym, czy będzie on równie chętnie wybieranym remedium, co GZIP będzie można przekonać się dopiero niebawem, niemniej warto przetestować jego działanie już dziś. A tym samym zaobserwować, w jakich obszarach ma przewagę nad innymi metodami, wykazując większą skuteczność.

Odbieramy telefony, odpisujemy na maile, nie ukrywamy kosztów, a dodatkowo oferujemy najszybsze pakiety hostingowe na rynku. Uważasz, że to zwroty marketingowe? Sprawdź sam/a!

Jeśli nie będziesz zadowolony/a, zwrócimy Ci pieniądze.
Twoje strony i sklepy przeniesiemy za darmo!

Hosting WordPressHosting Magento

Jeżeli masz jakiekolwiek pytania, skontaktuj się z nami! Kliknij tutaj.

Chcesz dowiedzieć się o nas trochę więcej? Przejdź na stronę JCHost.pl.

Daj znać znajomym!