Wolny sklep PrestaShop? Wynik Lighthouse to nie wszystko

Właściciele sklepów przychodzą nierzadko z jednym życzeniem: ujrzeć w narzędziu pomiarowym zielone 90 na telefonie oraz komputerze. Trudno się temu dziwić, ponieważ wynik jest prosty i łatwo go zestawić z innymi. W praktyce jednak samo przeglądanie cyferek z laboratorium przynosi niewiele. Stanowi ono narzędzie do wyszukiwania problemów, bo sklep z idealnym wynikiem potrafi wciąż przysparzać klientom kłopotów, a sklep z przeciętnym wynikiem może sprzedawać bez przeszkód.

Gdy czasu na optymalizację sklepu PrestaShop jest ograniczony, najwięcej przynosi szukanie konkretnych przyczyn i skutków: co dokładnie spowalnia sklep, w którym miejscu oraz od kiedy. Obserwacje zebrane przy pracy nad sklepami pomagają odróżnić rzeczywisty problem od samej liczby.

Lighthouse i dane od prawdziwych użytkowników to nie to samo

Lighthouse przeprowadza pomiar laboratoryjny: jedno wczytanie strony na symulowanym telefonie i łączu. W praktyce BeGiga wykonuje takie pomiary przy sklepie w trybie konserwacji, w kontrolowanych warunkach, a uzyskany wynik traktuje jako wskazówkę, gdzie szukać problemu. Obok tego PageSpeed Insights prezentuje dane terenowe, czyli doświadczenia prawdziwych użytkowników przeglądarki Chrome zebrane w ciągu ostatnich 28 dni, na rozmaitych urządzeniach i połączeniach.

Z tego powodu poprawka wprowadzona dziś potrafi od razu polepszyć wynik laboratoryjny, natomiast w danych terenowych ujawni się dopiero po kilku tygodniach. Brak zmian w PageSpeed Insights nazajutrz nie świadczy o tym, że poprawka nie zadziałała.

Szybkość ładowania a obciążenie hostingu

Szybkość ładowania strony oraz obciążenie hostingu to dwie odrębne sprawy, które jednak wzajemnie na siebie oddziałują. Motyw i obrazy rozstrzygają o tym, jak prędko strona wyświetli się w przeglądarce. Serwer rozstrzyga o tym, jak prędko w ogóle zacznie ją wysyłać. Gdy serwer jest przeciążony, nawet najlepiej zoptymalizowany motyw nie pomoże.

Typowy obraz sytuacji bywa następujący: wyniki w PageSpeed Insights mocno odbiegają od siebie przy kolejnych pomiarach, a hosting dźwiga duże obciążenie. Wówczas problemem jest prawdopodobnie obciążenie serwera, ruch sieciowy i czas odpowiedzi serwera, a nie optymalizacja motywu czy szablonu strony. W takiej sytuacji warto przyjrzeć się ruchowi automatycznemu, o którym traktuje artykuł Cloudflare nie jest firewallem, dopóki go nie skonfigurujesz.

Niestandardowe rozwiązania i trudne do wyjaśnienia anomalie

Im więcej w sklepie niestandardowych rozwiązań, tym więcej anomalii, których żadne narzędzie pomiarowe nie wyjaśni. Moduły cache, dodatkowe moduły analityczne, kilkadziesiąt modułów zewnętrznych czy kreatory stron umieją oddziaływać na siebie w nieprzewidywalny sposób. Przed głębszą analizą konieczne staje się wtedy uporządkowane sprawdzenie instalacji danego sklepu: wersji, modułów, ustawień i zasobów serwera. Taki audyt sklepu internetowego pozwala skrócić czas obserwacji i eksperymentów oraz prędzej znaleźć odpowiedź na część zjawisk.

Klienci za granicą i sieci CDN

Polskie sklepy hostuje się zwykle w Polsce, a coraz częściej sprzedają one również za granicę. Dla klienta z Hiszpanii bądź Wielkiej Brytanii każde zapytanie do serwera w Polsce trwa dłużej, niezależnie od tego, jak dobrze zoptymalizowany jest sklep. Ową różnicę zmniejszają sieci dostarczania treści (CDN), takie jak Bunny CDN czy Cloudflare, które przechowują obrazy i pliki statyczne bliżej klienta. Warunkiem pozostaje poprawna konfiguracja, żeby CDN nie przechowywał treści, które powinny być zawsze aktualne, takich jak koszyk czy ceny.

CCC i skrypty modułów

Funkcja łączenia, kompresji i przechowywania plików CSS i JavaScript, w PrestaShop nazywana CCC, powinna być włączona. Jest niezbędna do prawidłowego wersjonowania tych plików, także przez CDN: dzięki niej po każdej zmianie przeglądarki klientów pobierają nową wersję pliku. Bez niej zmiany w wyglądzie mogą długo nie docierać do części klientów.

Trzeba przy tym pamiętać o dwóch rzeczach, które nie są powszechnie znane. Po pierwsze, nie wszystkie moduły dołączają swoje skrypty do wspólnego pliku. Bramki płatności, moduły analityki czy obsługi zgód na pliki cookies często ładują je osobno, więc CCC ich nie obejmie. Po drugie, po włączeniu CCC strona może nagle przestać działać poprawnie. Zwykle nie jest to wina samej funkcji, tylko błędów w kodzie JavaScript któregoś modułu, które wcześniej pozostawały niewidoczne.

GTM, piksele i Consent Mode a szybkość sklepu

Google Tag Manager porządkuje skrypty marketingowe w jednym miejscu, ale każdy tag nadal trzeba pobrać i wykonać w przeglądarce klienta. GA4, Google Ads, piksele Meta i TikToka, mapy ciepła, czaty i narzędzia do ankiet uruchamiają się zwykle na każdej podstronie. Wpływ GTM na szybkość strony zależy więc od tego, co jest w kontenerze. Kontener z kilkudziesięcioma tagami, z których część została po dawno zakończonych kampaniach, potrafi obciążyć telefon klienta bardziej niż niejeden moduł sklepu i pogorszyć wskaźnik INP, który mierzy, jak szybko strona reaguje na kliknięcia.

Drugim częstym źródłem kłopotów są te same tagi wczytywane kilka razy: przez moduł PrestaShop, przez GTM i przez kod wklejony kiedyś w motyw. Do tego dochodzi Consent Mode, który wymaga ustawienia domyślnego stanu zgód, zanim uruchomią się tagi. Skrypt platformy zgód ładuje się więc na samym początku, a jego rozmiar wprost przekłada się na to, kiedy klient zobaczy stronę. Za dużo tagów i za dużo skryptów to w praktyce ten sam problem, a jego rozwiązanie zaczyna się od listy tego, co naprawdę jest potrzebne i w jakiej kolejności ma się uruchamiać.

Najwyraźniej widać to w źle skonfigurowanych sklepach z wieloma domenami albo wersjami językowymi, szczególnie w trybie multistore. Każda domena dostaje osobny kontener lub osobny zestaw pikseli, tagi przygotowane dla jednego rynku uruchamiają się na wszystkich, a śledzenie między domenami ustawiono w kilku miejscach naraz, przez co zdarzenia się dublują. Uporządkowanie GTM i analityki w takim sklepie wchodzi w zakres audytu wydajności sklepu.

Kilka podstaw, o których warto pamiętać

Obrazy powinny być serwowane w nowoczesnych formatach i w rozmiarach dopasowanych do miejsca, w którym się wyświetlają. Strona nie powinna skakać podczas wczytywania: przesuwające się elementy, mierzone wskaźnikiem CLS, irytują klientów i obniżają ocenę strony. Skrypty, zwłaszcza zewnętrzne, warto ograniczać do niezbędnego minimum, bo każdy z nich spowalnia stronę.

Część modułów zbiera dane, na przykład statystyki odwiedzin czy logi, a to z czasem zwiększa rozmiar bazy danych. Dlatego zaleca się regularne czyszczenie niektórych tabel. Warto też sprawdzić, czy sklep ma zasoby serwera i ustawienia zgodne z wymaganiami swojej wersji PrestaShop. To podstawowe elementy, od których zaczyna się każdy audyt wydajności sklepu.