Dlaczego wydajność strony ma znaczenie (i to nie tylko dla wyniku w teście)

Pracę nad wydajnością sprzedaje się liczbą: podnieś wynik w Lighthouse powyżej 90. To słaby cel, bo wynik jest tylko przybliżeniem i da się go oszukać. Prawdziwe powody, by się tym przejmować, są bardziej konkretne.

Ile naprawdę kosztuje powolność

Konwersja. To najważniejsze i dobrze udokumentowane zarówno w e-commerce, jak i w pozyskiwaniu leadów: im wolniejsza strona, tym mniej osób robi to, po co przyszło. Efekt jest najsilniejszy w pierwszych sekundach. Przejście z czterech sekund na dwie znaczy dużo więcej niż z dwóch na półtorej.

Szczególnie użytkownicy mobilni. Twoja strona pewnie jest testowana na szybkim laptopie przy biurowym Wi-Fi. Spora część odwiedzających korzysta z trzyletniego telefonu z Androidem przy słabym zasięgu. To tam ludzie odpadają — i tego nie widać zza biurka.

Efektywność crawlowania. Przy dużych serwisach wolne odpowiedzi oznaczają mniej przecrawlowanych podstron na jedną wizytę. Jeśli masz tysiące adresów i wolny serwer, głębokie podstrony są odwiedzane rzadko, a zmiany dłużej trafiają do wyników.

Zaufanie. Ludzie oceniają kompetencje po pierwszej interakcji. Strona, która się zacina, przeskakuje i blokuje, sprawia wrażenie firmy, która wolno odpowiada na maile.

Trzy wskaźniki, które mają znaczenie

LCP — Largest Contentful Paint. Jak długo trwa, zanim pojawi się główny element. Zwykle to zdjęcie w nagłówku, tytuł albo zdjęcie produktu. Cel: poniżej 2,5 sekundy.

INP — Interaction to Next Paint. Jak długo strona reaguje, gdy ktoś coś kliknie albo dotknie. Na tym wskaźniku polegają strony obciążone JavaScriptem. Cel: poniżej 200 milisekund.

CLS — Cumulative Layout Shift. Jak bardzo strona skacze podczas ładowania. Zwykle przez zdjęcia bez wymiarów, podmieniane fonty albo wstrzykiwane banery. Cel: poniżej 0,1.

Mierz je na danych rzeczywistych — od prawdziwych odwiedzających — a nie tylko w narzędziach laboratoryjnych. Testy laboratoryjne działają na symulowanym urządzeniu z jednej lokalizacji; dane rzeczywiste mówią, czego doświadczają Twoi faktyczni odbiorcy.

Skąd zwykle bierze się poprawa

Z naszego doświadczenia na typowej stronie firmowej większość zysku dają cztery rzeczy:

1. Zdjęcia. Niemal zawsze największa część transferu. Serwuj nowoczesne formaty, dopasuj rozmiar do kontenera zamiast wysyłać oryginał 3000 px do miejsca na 600 px, ładuj leniwie wszystko poniżej pierwszego ekranu i podawaj wymiary, żeby układ nie skakał.

2. JavaScript, którego nie potrzebujesz. Analityka, czat, menedżer tagów, narzędzia do testów A/B, trzy fonty, platforma do zgód na cookies i biblioteka karuzeli. Każde z osobna wydawało się rozsądne. Razem często ważą więcej niż sama strona. Sprawdź, co się ładuje, i zapytaj, ile każda z tych rzeczy jest warta.

3. Fonty. Hostuj je samodzielnie, ogranicz do znaków, których używasz, ładuj z wyprzedzeniem ten, którym jest złożony nagłówek, i używaj font-display: swap, żeby tekst był czytelny w trakcie ładowania.

4. Strategia renderowania. Generowanie statyczne albo renderowanie na serwerze z rozsądnym cache wygrywa z aplikacją, która wszystko pobiera po załadowaniu — przy stronach z treścią, czyli przy większości stron firmowych.

Na co nie warto tracić czasu

• Wyciskanie ostatnich punktów z wyniku Lighthouse przez odraczanie rzeczy, których użytkownik potrzebuje od razu.
• Mikrooptymalizacje kodu na stronie, której prawdziwym problemem jest zdjęcie w nagłówku ważące 4 MB.
• Usuwanie naprawdę przydatnej funkcji, żeby zyskać 20 milisekund.

Wydajność to środek, a nie cel. Jeśli zmiana sprawia, że strona jest szybsza, ale gorsza, to nie jest poprawa.

Pragmatyczna kolejność prac

1. Zmierz na danych rzeczywistych i znajdź najwolniejszy szablon, a nie najwolniejszą podstronę.
2. Popraw zdjęcia na tym szablonie.
3. Usuń albo odrocz zewnętrzne skrypty, których nikt nie potrafi uzasadnić.
4. Uporządkuj fonty.
5. Zmierz ponownie. Większość stron jest już na akceptowalnym poziomie.
6. Dopiero wtedy szukaj trudniejszych zysków.

Jeśli Twoja strona jest wolna i wolisz, żeby ktoś inny ustalił dlaczego, to normalna część audytu SEO — a w odróżnieniu od usług, które kończą się na analizie, możemy też wdrożyć poprawki.