Core Web Vitals 2026: ghid actualizat pentru LCP, CLS și INP

Pe doreltanase.com există articole despre Core Web Vitals și performanța web cu INP, dar acesta este ghidul consolidat și actualizat pentru 2026, cu toate cele trei metrici la un loc și cu tehnicile de optimizare specifice pentru INP care a înlocuit FID în 2024.

Core Web Vitals 2026: ghid actualizat pentru LCP, CLS și INP

Google evaluează Core Web Vitals pe baza datelor reale de la utilizatori (Chrome UX Report), nu pe teste de laborator. Aceasta face optimizarea mai complexă, dar și mai relevantă pentru experiența reală.

LCP (Largest Contentful Paint)

Praguri 2026: sub 2,5s = Bun, 2,5-4s = Necesită îmbunătățire, peste 4s = Slab.

<!-- Preîncarcă imaginea LCP -->
<link rel="preload" as="image"
  href="hero-image.webp"
  fetchpriority="high">

<!-- Nu folosi lazy loading pe imaginea LCP -->
<img src="hero-image.webp"
  loading="eager"
  fetchpriority="high"
  alt="Descriere imagine">

CLS (Cumulative Layout Shift)

Praguri 2026: sub 0,1 = Bun, 0,1-0,25 = Necesită îmbunătățire, peste 0,25 = Slab.

/* Preveniți CLS prin declararea dimensiunilor */
img {
  width: 800px;
  height: 450px;
  aspect-ratio: 16/9;
}

/* Preveniți CLS cauzat de fonturi web */
@font-face {
  font-display: swap;
}

INP (Interaction to Next Paint)

INP a înlocuit FID în martie 2024 și măsoară latența tuturor interacțiunilor. Praguri 2026: sub 200ms = Bun, 200-500ms = Necesită îmbunătățire, peste 500ms = Slab.

INP slab este cauzat de JavaScript excesiv care blochează thread-ul principal. Soluții: împărțiți task-urile JavaScript lungi în chunk-uri mai mici, amânați JS neesențial cu defer și folosiți Web Workers pentru procesarea intensivă.

Instrumente de măsurare

• PageSpeed Insights: date de laborator și date reale CrUX
• Chrome DevTools: profiling detaliat al thread-ului principal
• Search Console, Core Web Vitals: date agregate de la utilizatorii reali

Concluzie

Core Web Vitals continuă să evolueze și ștacheta crește periodic. Monitorizarea continuă și optimizarea proactivă sunt mai eficiente decât intervențiile reactive după o scădere de clasament.

Descoperiți mai multe ghiduri tehnice pe blogul Dorel Tănase.