Najpierw zmierz
Uruchom PageSpeed Insights dla kilku ważnych adresów, nie tylko homepage. Strona usługowa i artykuł mogą zachowywać się zupełnie inaczej.
Patrz na LCP, INP i CLS. Dobry wynik LCP to 2,5 sekundy lub mniej. Nie próbuj jednak poprawiać każdej liczby naraz. Najpierw znajdź element, który najbardziej wpływa na odczuwalną szybkość.
Zapisz wynik przed zmianami. Dzięki temu będziesz wiedzieć, czy optymalizacja faktycznie pomogła.
Obrazy i hero
Najczęściej zaczynam od największych obrazów. Hero o szerokości 3000 pikseli zapisany jako ciężki PNG potrafi zabić wynik nawet na prostej stronie.
Dopasuj rozdzielczość do realnego użycia, używaj nowoczesnych formatów i nie lazy-loaduj obrazu, który jest głównym elementem LCP. Obrazy niżej na stronie mogą być ładowane później.
Warto ustawić width i height albo aspect-ratio, żeby przeglądarka od początku wiedziała, ile miejsca zarezerwować.
Fonty
Pięć grubości dwóch rodzin fontów wygląda niewinnie, ale każde dodatkowe źródło to kolejny koszt. Sprawdź, których odmian naprawdę używasz.
Jeśli korzystasz z fontów zewnętrznych, zwróć uwagę na sposób ich ładowania. W wielu projektach da się zmniejszyć liczbę requestów bez zmiany wyglądu.
Nie warto jednak optymalizować fontu kosztem nagłego przeskoku całego layoutu. Stabilność jest równie ważna jak szybkość.
JavaScript i trackery
Analytics, Clarity, Hotjar, chat, cookie consent i kilka narzędzi marketingowych potrafią razem zrobić sporą różnicę. Każdy skrypt ma sens osobno, ale suma bywa ciężka.
Sprawdź, które narzędzia są faktycznie używane. Jeśli dwa systemy nagrywają sesje użytkowników, być może nie potrzebujesz obu cały czas.
Skrypty analityczne powinny być ładowane w sposób, który nie blokuje głównej treści. Po każdej zmianie sprawdź, czy tracking nadal działa.
CLS i stabilność layoutu
CLS rośnie, gdy elementy przesuwają się już po rozpoczęciu renderowania. Częstym powodem są obrazy bez wymiarów, późno pojawiający się banner cookies albo font zmieniający szerokość tekstu.
Otwórz stronę na wolniejszym połączeniu i po prostu popatrz. Jeżeli przycisk ucieka spod kursora albo nagłówek przesuwa się o pół ekranu, użytkownik to czuje nawet bez znajomości wskaźnika CLS.
Czasem poprawa stabilności daje większe poczucie jakości niż urwanie kolejnych 100 ms z ładowania.
Hosting, cache i CDN
Jeśli front jest już lekki, a odpowiedź serwera nadal trwa długo, problem może leżeć głębiej. Wtedy warto sprawdzić hosting, cache, kompresję i CDN.
Na statycznej stronie zakres pracy jest zwykle prostszy niż w rozbudowanym WordPressie. Nie oznacza to jednak, że każdy serwer będzie tak samo szybki.
Najważniejsza zasada brzmi: jedna zmiana, test, sprawdzenie działania strony, kolejna zmiana. Dzięki temu nie kończysz z szybkim wynikiem i zepsutym formularzem.