Measuring real experience
Core web vitals capture how a page feels to real users, not just lab timings. Three metrics dominate.
- LCP, largest contentful paint, measures loading: when the biggest visible element finishes rendering.
- CLS, cumulative layout shift, measures visual stability: how much content jumps around unexpectedly.
- INP, interaction to next paint, measures responsiveness: the latency from a user input to the next visual update.
Improving each
The levers differ per metric.
- Improve LCP by optimizing the hero image, removing render blocking resources, and using a fast server response.
- Improve CLS by reserving space for images and ads with width and height, and avoiding inserting content above existing content.
- Improve INP by breaking up long tasks, deferring non urgent work, and keeping event handlers light.
Why INP replaced first input delay
The older metric only measured the first interaction, and only its input delay. INP looks at the slowest interactions across the whole visit and includes processing and rendering time, so it reflects ongoing responsiveness rather than a single moment.
Key idea
Track LCP for loading, CLS for stability, and INP for responsiveness, since together they reflect how the page actually feels.