Test rychlosti webu s reálnými daty uživatelů

Co zjistíte

• LCP, INP a CLS podle reálných návštěvníků z Chrome UX Reportu, pokud je pro Váš web Google eviduje.
• Jestli web posílá obrázky ve WebP nebo AVIF, nebo pořád jen v PNG a JPEG, a kolik jich na stránce vůbec je.
• Skripty v hlavičce stránky, které blokují vykreslení, dokud se nestáhnou a nespustí.
• Jestli server odpověď komprimuje a jestli odpověď stránky nese hlavičku Cache-Control, nebo se stahuje bez ní při každé návštěvě znovu.
• Riziko, že se rozložení stránky během načítání posune a návštěvník klikne na něco jiného, než zamýšlel.
• Odhad celkové váhy stránky ze stylů, skriptů a fontů, které se do ní načtou — obrázky do odhadu nevstupují.

Laboratoř versus reálný provoz

PageSpeed Insights změří jedno načtení za standardizovaných podmínek: pevná rychlost sítě, referenční zařízení, prázdná cache. Číslo, které dostanete, je opakovatelné a dá se srovnávat mezi weby. S tím, jak stránku vidí konkrétní člověk na svém telefonu, ale souviset nemusí. Ten čeká na pomalém mobilním připojení ve vlaku, na starším Androidu s méně výkonným procesorem, nebo naopak na rychlé optice s prohlížečem plným rozšíření, která běh stránky zpomalují úplně jinak.

Proto existuje Chrome UX Report. Google z něj čerpá anonymizovaná data o výkonu od uživatelů, kteří v Chromu povolili sdílení statistik, a agreguje je po doménách za posledních 28 dní. Když má o Vašem webu dost dat, zveřejní je jako takzvaná polní data: skutečné hodnoty LCP, INP a CLS z reálných návštěv, ne odhad z jednoho běhu. A právě podle nich, ne podle laboratorního skóre, Google při hodnocení stránek posuzuje, jak rychlá stránka pro uživatele opravdu je.

Tři metriky, které rozhodují

LCP, tedy vykreslení největšího prvku, by se mělo objevit do 2,5 sekundy od začátku načítání. Na českých e-shopech ho nejčastěji zdrží hero obrázek na úvodní stránce — velký soubor bez nastavené šířky a výšky, který se navíc stahuje z pomalejšího CDN nebo se vykresluje až po zbytku layoutu.

INP, odezva na interakci, má zůstat pod 200 milisekundami. Typický viník bývá chatovací widget třetí strany: jeho skript zabere hlavní vlákno prohlížeče přesně ve chvíli, kdy návštěvník klikne na tlačítko v košíku, a klik se zpracuje se znatelným zpožděním.

CLS, posuny rozložení stránky, by neměly přesáhnout hodnotu 0,1. Za tím obvykle stojí banner nebo lišta se souhlasem, která se vloží nad obsah až po jeho vykreslení, takže se všechno pod ní odsune o desítky pixelů dolů — přesně ve chvíli, kdy se návštěvník chystal kliknout na odkaz.

Co web nejčastěji zpomaluje

Obrázky v PNG tam, kde by stačilo WebP nebo AVIF, jsou nejběžnější a nejsnáz opravitelná příčina. Fotka produktu z fotobanky uložená v PNG dokáže vážit i pětkrát víc než stejný snímek převedený do modernějšího formátu, a na stránce s desítkami produktů se to sečte rychle.

Marketingové skripty — měřicí kódy, chat, heatmapy a podobné nástroje třetích stran — se instalují jedním vloženým tagem a pak už je nikdo nesleduje. Přitom právě ony bývají tím, co reálně zpomaluje interakci se stránkou, protože běží na pozadí bez ohledu na to, jestli je návštěvník zrovna používá.

Webfonty bez atributu font-display umí na chvíli schovat celý text stránky, dokud se soubor s písmem nestáhne.

A chybějící cache hlavičky znamenají, že se stejný CSS soubor nebo logo stahuje znovu při každé návštěvě, i když se od minula nezměnilo ani o bajt.

Jak číst výsledek a kde začít

Test seřadí nálezy podle závažnosti, ne podle pořadí, v jakém je našel. Nejdřív se vyplatí řešit to, co má velký dopad na rychlost a malou pracnost opravy — komprese obrázků nebo doplnění chybějící Cache-Control hlavičky patří přesně sem. Teprve pak přijde na řadu přestavba šablony nebo výměna chatovacího widgetu za lehčí variantu, protože takové zásahy stojí víc práce a vyplatí se je naplánovat předem, ne řešit narychlo.

Po každé úpravě má smysl web přeměřit znovu na stejné adrese — opakovaná kontrola téže stránky se do denního limitu nepočítá. Nové měření si vyžádáte tlačítkem Spustit znovu na výsledkovce vlastní kontroly, takže skutečný efekt zásahu vidíte hned. Návštěvník se sdíleným odkazem dostane uložený výsledek.