Core Web Vitals are Google's attempt to measure real user experience with three numbers: how fast the page loads, how quickly it responds, and how stable it looks while loading. They're a lightweight ranking signal — but more importantly, they correlate directly with bounce rate and conversions.
LCP — Largest Contentful Paint
LCP measures how long it takes for the largest visible element (usually a hero image, heading, or block of text) to render. It's your "does this page feel fast?" metric.
- Good: ≤ 2.5s · Needs work: ≤ 4s · Poor: > 4s
Biggest wins: serve the LCP image in a modern format at the right size, preload it, avoid render-blocking CSS/JS, and use a fast host or CDN. A slow server response (TTFB) puts a ceiling on how good LCP can be.
INP — Interaction to Next Paint
INP replaced First Input Delay in 2024. It measures the latency of interactions — the time from a tap or click to the next frame the browser paints. High INP is what makes a page feel "janky" or unresponsive.
- Good: ≤ 200ms · Needs work: ≤ 500ms · Poor: > 500ms
The usual cause is heavy JavaScript blocking the main thread. Break up long tasks, remove unused scripts, debounce expensive handlers, and be wary of third-party tags (chat widgets, analytics, ads) that run on every interaction.
CLS — Cumulative Layout Shift
CLS measures how much the page jumps around as it loads. You've felt it: you go to tap a button and an ad loads, pushing it down. It's measured as a unitless score.
- Good: ≤ 0.1 · Needs work: ≤ 0.25 · Poor: > 0.25
Fixes are mostly about reserving space: set explicit width/height (or aspect-ratio) on images and iframes, reserve slots for ads and embeds, and avoid inserting content above existing content. Use font-display: optional or preload fonts to reduce text reflow.
Field vs lab data
There are two ways to measure vitals. Lab data (Lighthouse, DevTools) runs a simulated load — great for debugging, reproducible. Field data (the Chrome UX Report) is what real users experienced — this is what Google actually uses for ranking. A page can look perfect in the lab and still fail in the field on real devices and networks.
You can read live vitals for the page you're on directly in the browser — SEO Inspector shows LCP, INP, CLS, FCP and TTFB, colour-coded against these exact thresholds.
The highest-impact fixes
- Optimise the LCP image (format, size, preload) — biggest single lever.
- Cut and defer JavaScript — helps both INP and LCP.
- Reserve space for anything that loads late — images, ads, embeds.
- Use a CDN and cache aggressively to lower TTFB.
- Audit third-party scripts ruthlessly; each one is a tax on every metric.
You rarely need all of them. Measure first, fix the worst metric, measure again.
