Metrika INP a Core Web Vitals v praxi: Proč váš web ztrácí pozice a jak zrychlit odezvu
Rychlost načítání webu už dávno není jen o tom, za kolik sekund se objeví úvodní obrázek. Google hodnotí uživatelský zážitek v reálném čase (tzv. Real User Metrics).
Klíčovou metriku odezvy představuje INP (Interaction to Next Paint), která definitivně nahradila starší ukazatel FID (First Input Delay). Pokud váš web při kliknutí na menu, odeslání formuláře nebo otevření košíku „zamrzá“, přicházíte nejen o konverze, ale i o organické pozice ve vyhledávání.
V tomto článku si ukážeme, co přesně INP měří, jaké jsou limity a jak technicky vyřešit nejčastější příčiny zpoždění.
Přehled Core Web Vitals: 3 klíčové metriky
Google sleduje tři základní pilíře technického stavu stránky:
| Metrika | Zkratka | Co měří? | Cílová hodnota (Dobrý stav) |
|---|---|---|---|
| Interaction to Next Paint | INP | Rychlost odezvy a překreslení stránky po jakékoliv interakci uživatele (kliknutí, stisk klávesy). | ≤ 200 ms |
| Largest Contentful Paint | LCP | Doba načtení největšího viditelného bloku obsahu (hlavní banner, nadpis H1). | ≤ 2,5 s |
| Cumulative Layout Shift | CLS | Vizuální stabilita stránky – poskakování prvků během načítání. | ≤ 0,1 |
Co je INP a proč byl FID nedostatečný?
Starší metrika FID měřila pouze zpoždění při úplně první interakci uživatele po načtení stránky a ignorovala čas potřebný k samotnému vykreslení výsledku.
INP hodnotí všechny interakce během celé návštěvy uživatele na stránce (otevření mobilního hamburger menu, rozbalení filtru produktů, kliknutí na tlačítko „Přidat do košíku“). Výsledná hodnota představuje nejdelší zjištěné zpoždění, kterému byl uživatel vystaven.
Fáze jednoho kliknutí podle INP:
- Input Delay: Doba, než hlavní vlákno prohlížeče (Main Thread) začne zpracovávat událost (často blokováno běžícím JavaScriptem na pozadí).
- Processing Time: Čas potřebný k vykonání vašeho JavaScript kódu (event listener).
- Presentation Delay: Doba, než prohlížeč přepočítá layout (Recalculate Style) a vykreslí nový pixel na obrazovku.
4 nejčastější zabijáci metriky INP
1. Příliš mnoho analytických a marketingových skriptů
Google Tag Manager, měřicí pixely Meta/TikTok, heatmapy (Hotjar/Clarity) a live chaty spouštějí svůj kód současně na hlavním vlákně prohlížeče. Když uživatel klikne, prohlížeč musí počkat, až doběhnou všechny měřicí skripty.
- Řešení: Využívejte Server-Side GTM, odložte spouštění zbytných skriptů pomocí
requestIdleCallback()nebo načítání chatovacích widgetů až po prvním pohybu uživatele.
2. Dlouhé úlohy v JavaScriptu (Long Tasks)
Jakákoliv úloha na hlavním vlákně, která trvá déle než 50 ms, je považována za „Long Task“ a blokuje odezvu uživatelského rozhraní.
- Řešení: Rozdělte těžké operace na menší kousky pomocí moderního
scheduler.yield()nebosetTimeout(), aby prohlížeč stihl mezi výpočty překreslit rámec obrazovky.
3. Zpožděné renderování velkých DOM stromů
Pokud po kliknutí na filtr e-shopu vkládáte do stránky stovky nových DOM elementů najednou, prohlížeč spotřebuje desítky milisekund na přepočet stylů.
- Řešení: Používejte virtuální scrollování, pagination a CSS vlastnost
content-visibility: autopro prvky mimo obrazovku.
Jak zjistit stav vašeho webu?
Problémy s Core Web Vitals se často neprojeví na výkonném počítači vývojáře, ale na běžném mobilním telefonu na 4G síti.
Pomocí modulu Pinsero Health můžete provést hloubkový audit výkonu:
- Změříte LCP, CLS i INP v simulovaném i reálném prostředí.
- Identifikujete konkrétní JavaScriptové balíčky, které blokují hlavní vlákno.
- Získáte jasný akční seznam doporučení pro vývojáře.
Spusťte si diagnostiku výkonu na Pinsero Health a optimalizujte své Core Web Vitals dříve, než se propadnou vaše pozice ve vyhledávání.