Preskočiť na obsah
Marek Mihalčin
Menu
← Blog

Slovník Core Web Vitals: LCP, INP, CLS a ďalšie pojmy

Základný slovník - definície, čísla, typické pasce a kvalitné zdroje pre každú metriku.

· 13 min čítania

Core Web VitalsLCPINPCLS

Core Web Vitals sú tri metriky - LCP, INP a CLS. Web ich spĺňa, keď sú všetky tri v "zelených číslach" na 75. percentile návštev, pre mobilné zariadenia a desktop. Tento slovník je referenčná stránka, podľa ktorej sa môžete orientovať: každý pojem má definíciu, prahy, typické pasce a odkaz na primárny zdroj.

Všetky prahy nižšie sú hodnotené na p75 z reálnych používateľov (web.dev: Web Vitals). Štandardne sa pri metrikách rozlišujú tri intervaly: Good, Needs improvement a Poor. Ak je metrika v zelenom, stránka je "good" pre túto metriku.

MetrikaČo meriaGoodNeeds improvementPoorStatus
LCPNačítanie najväčšieho viditeľného obsahu≤ 2,5 s2,5–4,0 s> 4,0 sCore Web Vital
INPOdozva na interakcie≤ 200 ms200–500 ms> 500 msCore Web Vital (od 12. 3. 2024)
CLSVizuálna stabilita≤ 0,10,1–0,25> 0,25Core Web Vital
TTFBOdozva servera≤ 0,8 s0,8–1,8 s> 1,8 sDiagnostická
FCPPrvé vykreslenie obsahu≤ 1,8 s1,8–3,0 s> 3,0 sDiagnostická
TBTBlokovanie hlavného vlákna (lab)< 200 ms--Lab proxy pre INP

Ako čítať tento slovník: najprv základné pojmy (p75, field vs. lab), potom tri Core Web Vitals, diagnostické metriky, aktuálne dáta o stave webu a nakoniec ďalšie pojmy.

Základné pojmy

Web Vitals - iniciatíva Googlu, ktorá definuje signály kvalitného používateľského zážitku na webe. Zahŕňa aj pomocné metriky ako TTFB, FCP či TBT (web.dev).

Core Web Vitals (CWV) - podmnožina Web Vitals, ktorá platí pre každú stránku a je priamo merateľná na webe. V súčasnosti sú to LCP (načítanie), INP (interakcie) a CLS (vizuálna stabilita). Stabilné metriky sa menia najviac raz ročne a každá zmena ide do verejného changelogu.

Životný cyklus metriky - experimental → pending → stable. Pending fáza trvá najmenej šesť mesiacov, aby sa ekosystém stihol prispôsobiť. Touto cestou prešlo napríklad INP predtým ako nahradilo pôvodnú metriku FID(first input delay).

p75 (75. percentil) - hodnota, pod ktorou je 75 % meraní. Stránka je „good“, keď aspoň 75 % návštev spĺňa prah. Dôvodom na využívanie tohoto percentilu je, aby nám odchýlky spôsobené sieťou alebo zariadeniami s extrémne odchýlenými hodnotami nevychýlili výsledky. Hodnotí sa zvlášť mobil a desktop, kvôli rôznym zobrazovacím a sieťovým podmienkam.

Passing / „prešiel CWV“ - stav, keď web spĺňa všetky tri Core Web Vitals na p75 naraz. Ak chýba dátový bod pre INP (nikto neinteragoval), hodnotí sa zo zvyšných dvoch metrik.

Field data - merania od reálnych používateľov na ich zariadeniach a sieťach. Zdroje: CrUX a vlastný RUM. Toto sú dáta, podľa ktorých sa Core Web Vitals hodnotia.

Lab data - merania v kontrolovanom prostredí (Lighthouse, DevTools, WebPageTest). Sú reprodukovateľné a vhodné na ladenie, nevidia však skutočné interakcie uživateľov, cache ani rozmanitosť zariadení a sieťových podmienok. Lighthouse preto INP nemeria a používa TBT ako proxy (web.dev).

CrUX (Chrome User Experience Report) - verejný dataset anonymizovaných terénnych meraní z Chromu. Poháňa PageSpeed Insights, Search Console aj CrUX v DevTools (CrUX dokumentácia).

28-dňové okno - CrUX v PageSpeed Insights a CrUX API sú agregované za posledných 28 dní. Oprava nasadená dnes sa preto v skóre prejaví postupne a naplno až po zhruba štyroch týždňoch.

Origin vs. URL - CrUX má dáta za celú doménu ale aj za jednotlivé podstránky, pokiaľ majú dostatočnú návštevnosť.

RUM (Real User Monitoring) - vlastné meranie hodnôt pri uživateľoch, typicky cez knižnicu web-vitals alebo cez iný na to určený nástroj. Na rozdiel od CrUX, tu sme schopní merať hodnoty pre všetky prehliadače, každý pageview a vieme úsť viac do hĺbky (ktorý element bol problémový, ktorá interakcia je pomalá, ...). Aj Google odporúča mať vlastné RUM popri CrUX.

Atribúcia (attribution build) - verzia web-vitals (web-vitals/attribution), ktorá k hodnote pridá príčinu: LCP element, INP interakcie a jej fázy, element s najväčším posunom pri CLS.

LCP - Largest Contentful Paint

LCP je čas od začiatku navigácie po vykreslenie najväčšieho obrázku alebo najväčšieho textového bloku vo na obrazovke(viewport). Good je ≤ 2,5 s na p75 (web.dev: LCP).

Kandidáti na LCP element - <img>, <image> v SVG, náhľad <video>, element s CSS background-image cez url() a blokové elementy s textom. Štatistiky podľa Web Almanac 2025 tvrdia, že LCP elementom je obrázok na 76 % mobilných a 85 % desktopových stránok, text na 24 % mobilných (Web Almanac 2025).

Fázy LCP (LCP subparts) - každé LCP sa dá bez medzier rozložiť na štyri časti, ktoré spolu dávajú celkový čas (web.dev: Optimize LCP):

FázaČo meriaOdporúčaný podiel
TTFBOd navigácie po prvý bajt HTML~40 %
Resource load delayOd TTFB po začiatok sťahovania zdroja LCP< 10 %
Resource load durationSťahovanie LCP zdroja~40 %
Element render delayOd stiahnutia po vykreslenie elementu< 10 %

Typické problémy:

  • loading="lazy" na LCP elemente: robí to 16-17 % stránok, hoci to vždy zhorší samotnú rýchlosť vykreslenia LCP elementu, pretože sa sťahuje neskôr. Lazy v tomto prípade nie je riešením.
  • LCP obrázok nie je v HTML (vložený JavaScriptom, data-src, CSS pozadie bez preloadu),
  • chýbajúci fetchpriority="high": používa ho len 17 % mobilných stránok s LCP obrázkom,
  • client-side rendering, A/B testovacie skripty skrývajúce obsah, synchrónne skripty v <head>.

Podpora v prehliadačoch - Firefox meria LCP od januára 2024, Safari od verzie 26.2 (december 2025) (DebugBear).

INP - Interaction to Next Paint

INP meria najhoršiu (takmer najhoršiu) odozvu na kliknutia, ťuknutia a stlačenie klávesov počas celej návštevy stránky. Good je ≤ 200 ms na p75 (web.dev: INP). Core Web Vital je od marca 2024, keď nahradilo metriku FID (web.dev blog).

Prečo je to dôležité - podľa dát Chromu trávi používateľ 90 % času na stránke až po jej načítaní. FID meralo len prvú interakciu uživateľa a INP sleduje všetky interakcie.

Interakcia - skupina event handlerov jedného logického gesta (napr. pointerdown + pointerup + click pri ťuknutí). Počítajú sa iba klik myšou, ťuknutie a klávesnica. Scroll alebo zoom sa nepočítajú.

Tri fázy interakcie:

  1. Input delay - od vstupu po spustenie prvého handlera. Rastie, keď nám úkon blokujú dlhé úlohy (hydratácia, scripty tretích strán).
  2. Processing duration - beh všetkých event handlerov interakcie.
  3. Presentation delay - od konca handlerov po vykreslenie ďalšieho frame-u (style, layout, paint). Veľký DOM a layout thrashing ju predlžujú.

Pravidlo outlierov - na každých 50 interakcií sa ignoruje jedna najhoršia. Väčšina návštev má však často menej ako 50 interakcií, takže sa obvykle odreportuje tá úplne najhoršia.

Kedy INP chýba - používateľ nevykonal nijakú interakciu, iba scrolloval, alebo išlo o bota. Lab nástroje bez skriptovaných interakcií INP nenamerajú; v takom prípade sa sleduje TBT.

Typické problémy:

  • dlhé synchrónne handlery - napríklad filtrovanie veľkého zoznamu pri každom stlačení klávesy,
  • drahá reaktivita bez debouncu alebo throttlingu,
  • zmena, pri ktorej prerenderujeme veľkú časť strany,
  • množstvo JS ktoré beží na pozadí a blokuje tým hlavné vlákno (reklamy, analytika, widgety tretích strán),

Podpora v prehliadačoch - Firefox podporuje interactionId potrebné pre INP od októbra 2025, Safari od verzie 26.2 (DebugBear).

CLS - Cumulative Layout Shift

CLS je súčet neočakávaných posunov počas celej návštevy podstránky. Good je ≤ 0,1 na p75 (web.dev: CLS). Je bezrozmerné - nie sekundy, nie pixely. Vyjadrená je koeficientom, ktorý sa počíta z veľkosti posunutých elementov a vzdialenosti, o ktorú sa posunuli.

Layout shift - viditeľný element zmení svoju počiatočnú pozíciu. Pridanie nového elementu alebo zmena veľkosti nie je posun, pokiaľ neposunie iné viditeľné elementy.

Layout shift score - súčin dvoch zlomkov: layout shift score = impact fraction × distance fraction.

  • Impact fraction - podiel viewportu, ktorý zaberajú nestabilné elementy pred a po posune dohromady.
  • Distance fraction - najväčšia vzdialenosť, o ktorú sa element posunul, delená najväčším rozmerom viewportu.
  • Príklad z web.dev: element na 50 % viewportu sa posunie o 25 % výšky → 0,75 × 0,25 = 0,1875, čiže jediný takýto posun nás dostane k „poor“ hodnoteniu.

Session window - skupina posunov s menej než 1 s medzi nimi a maximálnou dĺžkou okna 5 s. CLS je skóre najhoršieho okna. Pôvodne bolo CLS súčtom všetkých posunov, čo neprimerane trestalo dlho otvorené stránky (obzvlášt postihovalo SPA).

Očakávaný vs. neočakávaný posun - posuny do 500 ms po diskrétnom vstupe (klik, ťuk, klávesa) majú príznak hadRecentInput a nezapočítavajú sa. Scroll, drag a pinch sa za takýto vstup nepovažujú.

Lab vs. field - lab nástroje vidia iba posuny počas načítania, takže CLS z Lighthouse býva nižšie než u reálnych používateľov.

Typické príčiny (Web Almanac 2025):

  • obrázky bez width/height alebo aspect-ratio - 62 % mobilných stránok má aspoň jeden,
  • výmena fontu za fallback s inými metrikami,
  • reklamy a iframy bez rezervovaného miesta,
  • animácie top/height namiesto transform - 40 % mobilných stránok.

Podpora v prehliadačoch - CLS (Layout Instability API) meria stále iba Chromium.

Diagnostické a historické metriky

Nasledujúce metriky nie sú Core Web Vitals, ale vysvetľujú, prečo je LCP alebo INP zlé.

TTFB - Time to First Byte - čas od začiatku navigácie po prvý bajt HTML odpovede. Zahŕňa presmerovania, DNS, TCP/TLS a spracovanie na serveri. Good ≤ 0,8 s, poor > 1,8 s (web.dev: TTFB). Je prvou podčasťou LCP, takže pomalé TTFB robí 2,5 dokáže narobiť veľké problémy pri LCP metrike.

FCP - First Contentful Paint - prvé vykreslenie akéhokoľvek obsahu (text, obrázok, SVG, nie-biely canvas). Good ≤ 1,8 s, poor > 3,0 s (web.dev: FCP). Veľký rozdiel TTFB → FCP signalizuje render-blocking zdroje.

TBT - Total Blocking Time - iba lab metrika: súčet časti dlhých úloh nad 50 ms medzi FCP a Time to Interactive. Good < 200 ms. Je to lab proxy pre INP, nie náhrada (web.dev: TBT).

Long task - úloha na main threade ktorá jedlhšia ako 50 ms. Blokuje vstup aj vykresľovanie.

LoAF - Long Animation Frames API - API, ktoré hlási frame-y oneskorené o viac ako 50 ms a pripisuje im konkrétne skripty. Je to najlepší nástroj na identifikáciu zlého INP v teréne (Chrome for Developers).

FID - First Input Delay (vyradené) - meralo iba input delay prvej interakcie. 12. marca 2024 ho nahradilo INP a z nástrojov Googlu bolo odstránené. Staré články s FID treba považovať za neaktuálne.

Speed Index, TTI - staršie lab metriky z Lighthouse. Speed Index meria, ako rýchlo sa obsah vizuálne vyplní; TTI bolo z Lighthouse 10 odstránené.

Stav webu v číslach

V júli 2025 spĺňalo všetky tri Core Web Vitals 48 % mobilných a 56 % desktopových verzií webov (Web Almanac 2025). Ide o posledný úplný ročný prehľad; ktorý štadardne vychádza ku koncu roka. Aktuálne mesačné čísla sú v CrUX.

Ukazovateľ (CrUX, júl 2025)MobilDesktop
Originy s dobrými CWV48 %56 %
Domovské stránky s dobrými CWV45 %-
Sekundárne stránky s dobrými CWV56 %-
Originy s dobrým TTFB44 %-

Mobil rástol aj po nástupe prísnejšieho INP v marci 2024. Desktop sa medzi 2024 a 2025 prakticky nepohol.

LCP je na mobile úzkym hrdlom, pretože jeho prvou podčasťou je TTFB, ktoré má dobré iba 44 % mobilných originov. CLS je jediná metrika, kde mobil vedie nad desktopom.

Pre kontext z rovnakej kapitoly:

  • domovské stránky spĺňajú CWV horšie ako sekundárne: 45 % vs. 56 % na mobile,
  • top 1 000 webov má dobré CWV na mobile v 51 %, stredne populárne weby (top 100 000) len v 37 %,
  • medián TBT na mobile stúpol na 1 916 ms (2024: 1 209 ms), hoci terénne INP sa zlepšilo.

Ďalšie pojmy A–Z

bfcache (back/forward cache) - prehliadač uloží celú stránku do pamäte a pri tlačidle Späť/Dopredu ju obnoví okamžite z pamäte. CLS aj INP sa vtedy resetujú. Blokujú ju napr. unload handlery (11 % desktopových stránok) a v Safari a Firefoxe aj Cache-Control: no-store (23 % stránok) (web.dev: bfcache, Web Almanac 2025).

Distribution (good / NI / poor) - CrUX neuvádza len p75, ale aj podiel návštev v každom pásme. Posun distribúcie ukáže zlepšenie skôr, než sa p75 prehupne cez prah.

Early Hints (HTTP 103) - server pošle preload/preconnect hinty ešte pred hotovým HTML. Zlepšuje FCP a LCP pri pomalom TTFB; používa sa na menej než 6 % stránok.

fetchpriority - HTML atribút (high/low/auto), ktorý mení prioritu sťahovania. Na LCP obrázok high, na neviditeľné slajdy karuselu low.

Hydratácia - kroky, ktorými frontendový framework pripojí JavaScript k serverovo vyrenderovanému HTML. Dlhá hydratácia je častým zdrojom input delay pri INP počas načítania.

Interop - každoročná iniciatíva výrobcov prehliadačov zjednotiť vybrané funkcie. V Interop 2025 boli LCP a INP (Event Timing), vďaka čomu ich dnes merajú Chrome, Firefox aj Safari.

Page-level vs. origin-level - Web Almanac ukázal, že sekundárne stránky majú lepšie CWV ako domovské (56 % vs. 45 % na mobile), pretože často profitujú z cache.

Preload scanner - paralelný parser, ktorý v surovom HTML hľadá zdroje na sťahovanie skôr, než sa vykoná JavaScript. Čo nevidí (obrázok vložený JS-om), sťahuje sa neskoro.

Soft navigation - zmena URL a obsahu v SPA bez plného načítania. Klasické CWV ju nemerajú ako novú stránku; Chrome testuje Soft Navigations API, ktoré má meranie rozšíriť (Chrome for Developers).

Speculation Rules - JSON pravidlá na prefetch alebo prerender celých stránok. Prerenderovaná navigácia môže mať LCP takmer nulové; WordPress ich má v jadre od verzie 6.8.

web-vitals.js - oficiálna knižnica Google Chrome tímu (onLCP, onINP, onCLS, onTTFB, onFCP), ktorá meria metriky rovnako ako nástroje Googlu, vrátane bfcache a reportovania pri visibilitychange (GitHub).

Zdroje

Primárne definície (Google / Chrome tím)

Dáta

Podpora v prehliadačoch

Súvisiace články