Jak przyspieszyc strone - Core Web Vitals krok po kroku

Co mierza Core Web Vitals i jakie sa progi

Core Web Vitals to trzy metryki, ktorymi Google mierzy realne doswiadczenie uzytkownika na stronie. Kazda ma wlasny prog - wynik ponizej "dobrego" wplywa na ranking w wynikach wyszukiwania.

Metryka	Co mierzy	Dobry wynik	Wymagajacy poprawy
LCP (Largest Contentful Paint)	Czas do wyswietlenia najwazniejszego elementu strony (hero, naglowek H1, duzy obraz)	< 2,5 s	2,5-4 s
INP (Interaction to Next Paint)	Czas reakcji strony na klikniecie lub dotyk uzytkownika	< 200 ms	200-500 ms
CLS (Cumulative Layout Shift)	Skumulowane przesuniecia elementow podczas ladowania (skaczace przyciski, przesuwajacy sie tekst)	< 0,1	0,1-0,25

Poza Core Web Vitals istotny jest TTFB (Time To First Byte) - czas od wyslania zapytania do odebrania pierwszego bajtu z serwera. Wartosci powyzej 800 ms sugeruja problem po stronie hostingu lub bazy danych, nie samego kodu frontendowego.

Jak sprawdzic szybkosc swojej strony

Google PageSpeed Insights (pagespeed.web.dev) to punkt startowy - analizuje strone pod katem Core Web Vitals i podaje konkretne zalecenia z szacowanym zyskiem. Wynik 90+ w kategorii Performance to cel, ale wazniejsze sa dane z "Prawdziwych uzytkownikow" (Field Data), ktore Google zbiera z Chrome - to te liczby liczy sie do rankingu, nie wynik laboratoryjny.

GTmetrix i Lighthouse (wbudowany w DevTools Chrome) uzupelniaja obraz o waterfall zasobow - widoczne jest dokladnie, ktory plik spowalnia ladowanie i o ile. Pingdom Website Speed Test przydaje sie do testu z serwera w konkretnej lokalizacji geograficznej.

Cztery zmiany z najwiekszym efektem na czas ladowania strony

Wiekszosc slow stron wynika z czterech tych samych przyczyn. Naprawiaj je w tej kolejnosci, bo kazda nastepna zmiana przynosi mniejszy efekt niz poprzednia.

1. Obrazy bez kompresji i w zlym formacie - to najczestszy winowajca. Pojedyncze zdjecie w PNG wazy 3-5 MB i samodzielnie niszczy LCP. Konwertuj obrazy na WebP (TinyPNG, ShortPixel) i wlacz lazy loading: atrybutem loading="lazy" na obrazach nizej na stronie. Hero i obraz w naglowku laduj bez lazy loading - one musza byc gotowe od razu.
2. Brak cache i CDN - bez pamieci podrecznej przegladarki kazda wizyta pobiera wszystkie zasoby od nowa. Cache ustawiasz w konfiguracji serwera lub wtyczce (LiteSpeed Cache, WP Rocket). CDN (Cloudflare) dostarcza pliki z serwera geograficznie blizszego uzytkownikowi - skraca TTFB do ponizej 200 ms, zamiast ponad sekundy przy polskim hostingu i klientach z zagranicy.
3. Zasoby blokujace renderowanie - JavaScript i CSS ladowane synchronicznie w wstrzymuja wyswietlanie strony. Krytyczny CSS wlacz inline, reszte odrocz z atrybutem defer albo przelacz na asynchroniczne ladowanie. Minifikacja plikow JS i CSS redukuje ich rozmiar o 20-40%.
4. Wolny serwer - zly hosting lub nieoptymalna konfiguracja - jesli TTFB przekracza 800 ms po wylaczeniu cache, problem lezy po stronie serwera. Sprawdz, czy hosting oferuje PHP 8.2+, HTTP/2 (albo HTTP/3) i kompresje Gzip lub Brotli. Stary wspoldzielony hosting z PHP 7.x potrafi byc trzy razy wolniejszy niz aktualna wersja przy tej samej stronie.

Na WordPressie duza czesc powyzszych zmian wprowadzasz przez wtyczki (WP Rocket, LiteSpeed Cache), bez dotykania kodu. Kluczowe: nie kumuluj wtyczek - kazda dodatkowa to kolejne zadanie HTTP i potencjalne spowalnianie przy aktywacji. Odinstaluj nieuzywane, a te cache'ujace miej tylko jedna.

CLS: dlaczego elementy skacza i jak to zatrzymac

Cumulative Layout Shift to metryka, ktora latwo przeoczyc, bo widac ja dopiero przy scroll - przyciski przesuwaja sie o kilka pikseli, kiedy doladowuje sie baner albo czcionka. Google traktuje kazde przesuniecie jako blad UX i karze niska ocena CLS.

Trzy czeste przyczyny:

• Obrazy bez zdefiniowanych atrybutow width i height - przeglarka nie rezerwuje miejsca, zanim plik sie zaladuje.
• Czcionki webowe bez font-display: swap lub bez preload - tekst skacze, gdy systemowa czcionka zostaje zastapiona docelowa.
• Reklamy i widgety zewnetrzne wstrzykiwane dynamicznie - rezerwuj im staly kontener z minimalnym height.

FAQ: optymalizacja szybkosci strony

Jaki wynik PageSpeed Insights jest dobry dla strony firmowej?

Wynik 90+ w Performance to dobry cel, ale wazniejsze sa dane Field Data - wyniki Core Web Vitals zmierzone na realnych urzadzeniach. Mozesz miec 95 punktow w tescie laboratoryjnym i jednoczesnie "wymagajacy poprawy" LCP w danych rzeczywistych, jesli uzytkownicy trafiaja na strone na slabym laczeniu mobilnym.

Ile czasu zajmuje optymalizacja szybkosci strony na WordPressie?

Podstawowe kroki (kompresja obrazow, wlaczenie cache, minifikacja) mozna wdrozyc w 2-3 godziny przez wtyczke. Glebokie zmiany - optymalizacja serwera, przebudowa krytycznej sciezki renderowania, eliminacja zbednych wtyczek - to 1-3 dni robocze i najczesciej wymagaja tez pracy po stronie hostingu.

Czy szybkosc strony faktycznie wplywa na pozycje w Google?

Tak, od 2021 roku Core Web Vitals sa oficjalnym czynnikiem rankingowym w algorytmie Page Experience. W praktyce efekt jest subtelny - nie awansujesz z pozycji 20 na 3 samym przyspieszeniem strony. Jednak na konkurencyjnych frazach, gdzie pozostale sygnaly sa zblizzone, wolna strona przegrywa z szybszym rywalem. Do tego wolna strona traci uzytkownikow zanim strona wogole sie zaladuje - to bezposrednia strata ruchu i konwersji.

Co to jest TTFB i kiedy jest problemem?

TTFB (Time To First Byte) to czas od wyslania zadania HTTP do odebrania pierwszego bajtu odpowiedzi serwera. Ponizej 200 ms jest dobrze, 200-800 ms to akceptowalny zakres, powyzej 800 ms to sygnal problemu z hostingiem, baza danych lub nieoptymalna konfiguracja PHP. Sam cache czesto sprowadza TTFB do 20-50 ms dla zasobow statycznych.

Czy CDN jest potrzebny malej firmie?

Cloudflare w darmowym planie wystarczy wiekszosci malych firm i wdrozy sie w pol godziny. Przyspiesza ladowanie przez cache na serwerach brzegowych, dodaje HTTPS bez kosztu certyfikatu i blokuje czesc ruchu botow. Platne plany CDN maja sens przy sklepach z duzym ruchem lub serwisach miedzynarodowych - mala strona lokalna nie potrzebuje drogiego rozwiazania enterprise.