Szybkość ładowania się stron i ich optymalizacja na tym polu ma nie tylko wpływu na to jak strona będzie odbierana przez odwiedzających, ale przede wszystkim jest to coraz istotniejszy czynnik rankingowy dla Google. Jeśli Twoja strona nie jest przyzwoicie zoptymalizowana, może zostać potraktowana jako mniej wartościowa, a to będzie oznaczało, że uzyskanie lepszych pozycji w wynikach wyszukiwania będzie utrudnione.
WordPress pomimo, że jest niezwykle popularny i daje duże możliwości, to pod kątem wydajności gepardem bym go nie nazwał. Nie oznacza to jednak, że nie może nim zostać, a sposobów na osiągnięcie tego celu jak zwykle jest wiele.
Jakie czynniki mają wpływ na to czy strona ładuje się szybko czy nie. Co decyduje o tym, że możemy o niej powiedzieć “ta strona jest przyzwoicie zoptymalizowana”. Oto kluczowe elementy mające wpływ na wydajność strony działającej na WordPress’ie, choć dotyczą także każdego innego systemu CMS:
Hosting
Środowisko w którym funkcjonuje Twoja strona jest niezwykle istotnym czynnikiem i choć nie jedynym i nie decydującym, to jednak od hostingu zależy całkiem sporo. Firmy hostingowe oferują najróżniejsze konfiguracje i wykorzystują odmienne technologie w tym ich mieszanki. Nie będę zagłębiał się w detale, bo nie wykluczone, że na słowo Apache pierwsze co przyjdzie Ci do głowy, to facet z pióropuszem na głowie. Ważne żebyś miał jednak świadomość, że hosting hostingowi nie równy. Usługi tego typu pełnią swoją podstawową funkcję w jednakowy sposób dając Ci miejsce dla plików strony i poczty elektronicznej jednak “pod maską” kryją się często znaczące różnice w tym takie, które z punktu widzenia wydajności Twojej strony na WordPressie są bardzo istotne.
Nie przesadzaj z wtyczkami
O ile na sam hosting wpływu większego nie masz, poza samym jego wyborem, o tyle masz realny wpływ na to jak Twoja strona będzie zoptymalizowana. WordPress dzięki swojej olbrzymiej bazie dodatkowych rozszerzeń kusi aby spróbować dosłownie wszystkiego. Nie ma w tym nic złego pod warunkiem, że wtyczki dobierzesz rozsądnie, a te z których ostatecznie nie korzystasz usuniesz. Im więcej zainstalujesz wtyczek tym strona będzie coraz bardziej wymagająca, będzie potrzebowała coraz więcej czasu na wykonanie rozmaitych operacji i wyrenderowanie tego co wyświetli się w oknie przeglądarki.
Obrazy
To kolejny element mający znaczny wpływ na szybkość ładowania się stron. Im cięższe zdjęcia, co nie zawsze jest tożsame z ich rozmiarami w sensie wysokość i szerokość, tym więcej potrzeba czasu aby przeglądarka je wyświetliła. Może powiesz, że masz szybkie łącze, więc dla Ciebie to nie problem. Tak często odpowiadają mi Klienci, gdy staram się uczulić ich na ten aspekt optymalizacji. No cóż, ale nie tylko Ty będziesz przeglądał tę stronę. Będą z niej korzystali ludzie w różnych miejscach, także tam gdzie np. zasięg LTE w telefonach pozostawia wiele do życzenia. Zapewne Ty sam także znajdziesz się w takiej sytuacji nie raz, nie dwa. Poza tym jak wspomniałem szybkość ładowania się strony jest istotnym czynnikiem rankingowym dla Google, a tu nie podyskutujesz o prędkości swojego łącza i albo się dostosujesz, albo…
Inne korzyści? Chociażby mniejsze transfery danych na koncie hostingowym, mniej zajmowanej przestrzeni na dyskach.
Minimalizuj co się da
Zdjęcia zdjęciami, ale nie tylko one wymagają optymalizacji. Zmniejszyć możesz, a nawet powinieneś wiele innych plików. Zoptymalizuj wielkość plików zawierających kod strony czyli html, css, js. Na szczęście nie musisz tego robić ręcznie. Wystarczy, że będziesz wiedział jakich narzędzi użyć i jak je użyć. Minimalizuj nie tylko ich rozmiary poprzez tzw. minifikację i kompresję, ale także ich ilość starając się zmniejszyć w ten sposób wolumen zapytań jakie strona generuje do serwera. To wszystko robią wtyczki i choć czasem można im pomóc odpowiednią konfiguracją, to generalnie często standardowe ustawienia nie wymagające od Ciebie większego wysiłku są już i tak znaczące.
CDN
To usługi polegające w dużym skrócie na tym, że części Twojej strony np. pliki css, js czy zdjęcia są serwowane do przeglądarki z zewnętrznych serwerów. Np. jeśli ktoś łączy się z Twoją stroną z za Oceanu, to taka usługa do jego przeglądarki prześle zdjęcia z serwera ulokowanego blisko jego lokalizacji. A co to oznacza? Po prostu te części strony załadują mu się szybciej. Dodatkowo tak rozprowadzane elementy składowe strony zmniejszają obciążenie głównego serwera, a to znowu ma wpływ na jego większą wydajność, czytaj wydajność Twojej strony.
To oczywiście nie wszystko co można zoptymalizować, ale są to najważniejsze elementy, które nie powinny Ci sprawić większych trudności.
Przyśpieszamy WordPress'a
Przechodzimy do sedna naszego tematu. LiteSpeed Cache, to bezpłatna wtyczka, która zawiera w zasadzie wszystkie najważniejsze elementy optymalizacji strony, o których wspomniałem powyżej i obsługuje je naprawdę świetnie. Daje ona często większe możliwości niż niejedna wtyczka, za którą musiałbyś zapłacić. To rewelacyjna wiadomość, prawda?
Hosting w tym wypadku ma jednak kluczowe znaczenie. Wtyczka jest opracowana przez producenta niezwykle wydajnego oprogramowania serwera WWW o nazwie LiteSpeed. To alternatywa dla Indianina, o którym wspominaliśmy wcześniej jak i dla innych web serwerów, takich jak również bardzo wydajny Nginx. LiteSpeed uznawany jest jednak za najszybszy web serwer oferujący oprócz wysokiej wydajności także dużą skalowalność i bezpieczeństwo. Nie będę się skupiał na detalach technicznych tego rozwiązania, ale jeśli takie Cię interesują wygooglujesz sporo informacji na ten temat.
Tymczasem wracając do naszego tematu, to jak już pewnie się domyślasz, żeby możliwe było wykorzystanie pełnych możliwości wtyczki LiteSpeed Cache musisz mieć hosting, który działa na oprogramowaniu serwera LiteSpeed. I tu jest przysłowiowy pies pogrzebany, bo wiele firm hostingowych wykorzystuje inne rozwiązania. Dla przykładu jeśli LiteSpeed może kilkukrotnie zwiększyć wydajność strony, to już samo to środowisko daje do myślenia, a co dopiero gdy połączy się je z mechanizmami cache i dobrą optymalizacją. WordPress dostaje wiatru w skrzydła.
LiteSpeed Cache
Przyjrzyjmy się więc samej wtyczce LiteSpeed Cache. Jakie daje możliwości związane z optymalizacją WordPress’a?
Jeśli masz serwer wykorzystujący technologię LiteSpeed możesz przetestować korzyści wynikające z wdrożenia tej wtyczki. Jeśli takiego hostingu nie posiadasz, a chcesz zajrzyj tutaj.
Wtyczkę zainstalujesz w prosty sposób bezpośrednio z repopzytorium WordPress’a. Przejdź do wtyczek, wybierz opcję “dodaj nową”, a następnie w wyszukiwarce wpisz litespeed. LiteSpeed Cache pojawi się zapewne na pierwszej pozycji w wynikach wyszukiwania, a Tobie pozostaje wtyczkę zainstalować.
Gdy wtyczkę masz już na pokładzie wejdź w w jej ustawienia ogólne. Na pierwszy rzut oka nie ma tu zbyt wielu opcji. W zasadzie wystarczy zainstalować wtyczkę i w pierwszej zakładce ją aktywować. Nie będzie to pełna optymalizacja, ale na pewno wzrost wydajności strony będzie zauważalny. Możesz tu określić czas przez jaki poszczególne elementy mają być przechowywane w pamięci podręcznej.
Samo cachowanie tą wtyczką daje Ci już znaczące benefity, ale przecież chcemy stronę także odchudzić żeby ładowała się jeszcze szybciej. I tu z pomocą przychodzi zakładka “Zaawansowane” dostępna w prawym górnym rogu. Gdy na niej klikniesz do widoku jaki masz powyżej dojdzie kilka kolejnych, przy których zatrzymamy się na chwilę.
Zakładka nr 5 “Optymalizuj”, to miejsce gdzie możesz aktywować proces odchudzania plików HTML, CSS i JS. Możesz je minifikować i łączyć tak aby z wielu plików powstało ich odpowiednio mniej, co przełoży się na mniejszą ilość zapytań generowanych przez stronę do serwera. Włączysz asynchroniczne ładowanie plików CSS i JS, co jest kolejnym elementem mogącym mieć pozytywny wpływ na prędkość z jaką pojawią się pierwsze dane Twojej strony w przeglądarce osoby, która na nią trafi. Ta sekcja to jeden z istotniejszych elementów optymalizacji aczkolwiek musisz sprawdzić jak w Twoim konkretnym wypadku będą się zachowywały poszczególne opcje konfiguracyjne. Jeśli po włączeniu jednaj z nich strona nie będzie się poprawnie wyświetlać, co może się zdarzyć, bo każda strona jest przecież inna, działa na innym motywie z innymi rozszerzeniami, po prostu nie aktywuj tej opcji. Z testów jakie robiłem na różnych stronach zdarzało się, że aktywacja opcji asynchronicznego ładowania css-ów powodowała niepoprawne wyświetlanie się strony. Jeśli wiesz jak sobie z tym poradzić możesz pokombinować, ale jeśli nie po prostu nie aktywuj opcji, która zaburzy działanie strony.
Idąc dalej do zakładki numer 6 o nazwie “Tuning” dostajesz kolejne opcje pozwalające np. wykluczyć z całego procesu minifikacji określone pliki. Możesz to wykorzystać jeśli wiesz, który plik zachowuje się problematycznie. W tej zakładce dodatkowo możesz ustawić asynchroniczne ładowanie fontów Google lub w ogóle je wyłączyć, a także kilka innych opcji jak możliwość nadania priorytetu dla plików połączonych.
Zakładka nr 7 “Media”.
Lazy Load, to opcja która powoduje, że obrazki na stronie zaczynają się ładować dopiero wówczas gdy pojawiają się w obszarze widoku okna przeglądarki. Np. jeśli masz tekst ze sporą ilością tekstu i obrazów, to te będą zaczynały się ładować dopiero wówczas gdy przewiniesz stronę w miejsce gdzie się znajdują. Innymi słowy strona się uruchamia, ale jej fotki będą pobierane aż do momentu gdy faktycznie odwiedzający będzie chciał je obejrzeć. W tej zakładce możesz aktywować taką opcję zarówno dla obrazków jak również zawartości ładowanych za pomocą iframe, np. osadzone w ten sposób filmy itp…
Znajdziesz tu także opcje pozwalające na automatyzacje procesu optymalizacji samych zdjęć, do której to funkcjonalności za chwilę dojdziemy.
Zakładka nr 8 to “CDN”
W tym miejscu możesz skonfigurować komunikację z zewnętrznym CDN, w zasadzie dowolnym, ale dla ułatwienia jeśli nie czujesz się na siłach w moduł wbudowane jest API CloudFlare. Możesz więc śmiało wykorzystać tą popularną usługę w stosunkowo prosty sposób. CDN jak wspomniałem powyżej spowoduje zmniejszenie obciążenia serwera, zmniejszenie transferów, a także szybsze serwowanie statycznych danych plus niejednokrotnie podnosi bezpieczeństwo.
Zakładka 9 “ESI”, to temat dla bardziej zaawansowanych użytkowników. Opcja zazwyczaj wykorzystywana przez developerów np. pracujących przy kodowaniu szablonów, dlatego celowo pominę ten element podobnie jak zakładkę “Zaawansowane”, dzięki której można aktywować dodatkowe mechanizmy cache obiektowego (do wyboru memcache i redis). Debugowanie, to kolejna zakładka dla developerów, natomiast ostatnia pozwala na uruchomienie i skonfigurowanie wewnętrznego robota indeksującego. Najprościej mówiąc. Normalnie plik do pamięci podręcznej ładuje się wówczas, gdy pierwszy użytkownik otworzy daną stronę. Powiedzmy więc, że nie odczuwa on wówczas wyraźnie działania mechanizmów cache, natomiast gdy po tej czynności on lub ktokolwiek inny otworzy tę samą podstronę, zostanie ona załadowana już z pamięci podręcznej, a więc znacznie szybciej. Robot indeksujący ma za zadanie pełnić rolę tego “pierwszego” uruchamia więc stronę po to aby wygenerować jej obraz w pamięci.
Dotarliśmy do ostatniej zakładki konfiguracji ogólnej, ale to jeszcze nie wszystko, ponieważ mamy w zanadrzu kilka interesujących narzędzi. Z jednej strony musimy mieć możliwość czyszczenia pamięci cache, gdy uznamy to za konieczne. Na tym polu wtyczka oferuje całkiem sporo. Możesz wyczyścić całość, albo tylko określone zasoby. Poza tym w zakładce “Optymalizator DB” znajdziesz narzędzia pozwalające na utrzymywanie bazy danych WordPress’a w dobrej kondycji. To również istotny element mający wpływ na to jak szybko WordPress będzie działał. Warto z tej funkcjonalności co pewien czas skorzystać. Dodatkowo jest tu jeszcze zakładka pozwalająca na zarządzanie pamięcią na serwerach CDN.
Idąc jednak dalej trafiamy na narzędzie, które z pewnością będziesz często wykorzystywać. To narzędzie pozwalające na optymalizację zdjęć czy ogólnie obrazów ładowanych do WordPress’a.
Wystarczy Kliknąć w inicjację optymalizacji obrazów i w kolejnym kroku wysłać żądanie optymalizacji, aby nasze zdjęcia w mediach WordPress’a zostały przesłane na serwer LiteSpeed, gdzie zostaną zoptymalizowane i automatycznie przesłane ponownie na Twoją stronę. Niezwykle przydatna funkcjonalność, którą musiałbyś wdrożyć korzystając z dodatkowych wtyczek np. jednej z moich ulubionych ShortPixel. Tu jednak nie ma takiej potrzeby, bo wszystko masz w jednym miejscu.
Podsumowanie
LiteSpeed Cache to jedna z wielu wtyczek pozwalających na optymalizację strony i zwiększenie jej wydajności i prędkości działania. Bez wątpienia to ścisła czołówka, a nawet pokuszę się o stwierdzenie, że to na obecną chwilę najlepsze narzędzie do przyśpieszenia strony działającej na WordPressie.
Bawiąc się wtyczką na potrzeby tego artykułu bez problemu wygenerowałem na Google PageSpeed Insights wynik najlepszy z możliwych. Owszem im strona bardziej rozbudowana tym będzie wymagała bardziej precyzyjnych działań, jednak efekty pracy wtyczki w połączeniu z serwerem LiteSpeed Enterprise są świetne.
Zróbmy bardzo prosty i szybki test. Zainstalowałem na dwóch identycznych maszynach o tej samej wydajności dwa takie same instalacje WordPress’a. Standardowy motyw, zero jakichkolwiek modyfikacji. Dwie różnice: Pierwsza to to, że na serwerze X działa środowisko Apache, a na Y LiteSpeed. Druga to taka, że na WordPressie Y (serwer Y) jest dorzucona wtyczka LiteSpeed Cache. Test jest o tyle ciekawy, że standardowa nieobciążona niczym specjalnie instalacja WP z gruntu działa sprawnie. Pytanie czy zauważymy w takiej sytuacji jakieś wyraźne różnice, bo generalnie tego typu działania przynoszą najlepsze efekty na produkcyjnych stronach, gdzie WordPress ma już co robić. Różnice potrafią być olbrzymie, ale zobaczmy co możemy wycisnąć z bazowej instalacji bazując na danych z GTMetrix’a.
WordPress działający w środowisku Apache bez wtyczki cache otrzymał takie oto noty:
Czas pełnego załadowania wszystkich elementów nieco ponad 2 sekundy. Waga 269KB i raptem 16 zapytań. Jak ten wynik zmieni się gdy taka sama strona zostanie uruchomiona na LiteSpeed Cache?
Pomimo, że to lekka strona i niczym specjalnie nie obciążona, no może poza tym jednym dużym zdjęciem, które też można nieco zoptymalizować (nie robiłem tego), to i tak różnice widać wyraźnie. Czas ładowania całości został zredukowany o 0,7 sekundy. Całkowita waga strony z 269KB na 132KB, a więc nieco więcej niż o połowę. Ilość zapytań generowanych przez stronę została zredukowana z 16 do 6. Również ogólna ocena dotycząca wydajności i optymalizacji w przypadku rankingu PageSpeed Score (Google) osiągnęła najwyższy możliwy wynik, a analogiczny ranking Yahoo wzrósł o 7%.
Bez wątpienia serwer LiteSpeed w połączeniu z LiteSpeed Cache robi tu dobrą robotę. To co dla Ciebie jest też dodatkową korzyścią, to fakt, że w przypadku innych wtyczek o analogicznym przeznaczeniu podobny zestaw funkcji często jest dostępny tylko w wersjach PRO czyli płatnych. W tym wypadku wtyczka jest darmowa. Dlaczego? Serwer LiteSpeed jest oprogramowaniem płatnym w przeciwieństwie np. do serwera Apache, co oznacza, że rozwój wtyczki jest finansowany z opłat licencyjnych jakie ponoszą operatorzy usług hostingowych korzystający z tego rozwiązania. Można więc powiedzieć, że to dzięki Twojemu usługodawcy z tej wtyczki możesz korzystać bezpłatnie, to taki dodatkowy bonus od niego 🙂
Jeśli Twój dostawca hostingu wykorzystuje inne rozwiązania zainteresuj się taką wtyczka jak WP Fastest Cache. W wersji PRO robi też niezłą robotę i również masz dostęp do mechanizmów optymalizacji zdjęć.
A jeśli pod wpływem tego tekstu zainteresowało Cię konto hostingowe dla WordPress’a działające w środowisku LiteSpeed, które pozwoli Ci wskoczyć na wyższy poziom, znajdziesz je na stronie Hosting.
Pomimo tego, że LiteSpeed jest ciekawą technologią, twórcy WordPressa rekomendują dla tego systemu CMS środowisko oparte o serwer NGINX, gdzie świetnie sprawdza się wtyczka WPRocket. To rozwiązanie znajdziesz na stronie Hosting WordPress.
Zobacz również
Seraphinite Accelerator: Przyspiesz swoją stronę internetową jak nigdy dotąd
Czy zastanawiałeś się kiedykolwiek, jak przyspieszyć swoją stronę internetową bez konieczności żmudnego przeglądania setek artykułów i poradników? Pisałem o narzędziach do optymalizacji wydajności wielokrotnie na
MasterStudy LMS
Za sprawą pandemii rozwiązania LMS (Learning Management Systems) zyskały na popularności. Wiele osób dostrzegło dla siebie szansę w oferowaniu własnych szkoleń online, co doprowadziło do
Nowa edycja kursu WordPress na 2023 rok już jest!
Tak, dokładnie. Wczoraj ostatecznie nowa wersja mojego flagowego szkolenia ujrzała światło dzienne. Pracowałem nad nią przez ostatnich kilka miesięcy czego efektem jest zupełnie nowy materiał
Publikacje prosto na Twój email!
Zapisz się i obserwuj co dzieje się na Wooj, Uczymyjak i PoznajWP
W każdej chwili możesz zrezygnować z subskrypcji. Twój adres jest bezpieczny.
Polecane Oferty LifeTime!
WooLentor
Builder dla WooCommerce. Zaprojektujesz strony koszyka, zamówienia, konta klienta, produktów itd… Do tego ogrom innych funkcji, pozwalających zwiększyć konwersję.
SmartQuizBuilder dla agencji
Połącz zabawę z marketingiem dodając na swojej stronie ankiety i różnego rodzaju quizy.
Trust – dowody społeczne
Kolekcjonuj opinie o swoich produktach lub usługach także w formie recenzji video!
Wpis akuratnie dla mnie, zaraz zabieram się za aktualizację wtyczek na moim blogu, bo dotarło do mnie że mam biedę z wtyczkami. Dzięki za ten wpis, dobra robota!
Bardzo dużo się dowiedziałem z tego artykułu, szacun.
Czy można korzystać z tej wtyczki równocześnie z Wp Super Cache?
Świetny tema! Dzięki za wyświetlenie. 😉