Google's Three Core Web Vitals
Core Web Vitals are three page-experience signals used by Google as ranking inputs. Every URL is measured on the 75th percentile of real user data — not on lab tests.
LCP — Largest Contentful Paint
| Rating | Time |
|---|---|
| Good | ≤ 2,500 ms |
| Needs Improvement | 2,500–4,000 ms |
| Poor | > 4,000 ms |
LCP measures when the largest visible element in the viewport finishes rendering. Usually the hero image or H1. Common causes of poor LCP: unoptimised hero image, render-blocking CSS/JS, slow TTFB, missing preload for the hero image, lazy-loading the LCP element.
INP — Interaction to Next Paint
| Rating | Time |
|---|---|
| Good | ≤ 200 ms |
| Needs Improvement | 200–500 ms |
| Poor | > 500 ms |
INP replaced FID in 2024. It measures the delay between a user interaction (click, tap, keypress) and the next frame painted. Long JavaScript tasks block the main thread and inflate INP.
CLS — Cumulative Layout Shift
| Rating | Score |
|---|---|
| Good | ≤ 0.1 |
| Needs Improvement | 0.1–0.25 |
| Poor | > 0.25 |
CLS measures unexpected visual movement. Images without explicit width/height, web fonts loading late, and injected ads/banners all contribute. Fix by reserving space for every dynamic element.
Where to Get Real Data
- PageSpeed Insights — real-user CrUX data plus lab data from Lighthouse.
- Search Console → Core Web Vitals — URL-group-level status across your site.
- Chrome UX Report API — programmatic access to CrUX.
- web-vitals JS library — capture field data from your own users with
onLCP,onINP,onCLS.
Quick Wins by Impact
- Preload the LCP image with
<link rel="preload" as="image">. Fastest single LCP improvement. - Convert images to WebP/AVIF and set explicit dimensions.
- Split long JS tasks using
setTimeout/requestIdleCallback/ worker threads. - Defer non-critical JS with
deferortype="module". - Reserve space for ads and embeds with min-height / aspect-ratio.
- Preload critical fonts with
<link rel="preload" as="font" crossorigin>.