How to improve website performance: a practical guide to Core Web Vitals
By the LaunchSafer team ·
What LCP, INP and CLS actually measure, and the fixes that improve them most on typical websites.
Google's Core Web Vitals measure three things visitors notice: how fast the main content appears, how quickly the page responds, and whether it jumps around.
Largest Contentful Paint (LCP)
LCP is when the largest element in the first screen — usually a hero image or headline — finishes rendering. Good is 2.5 seconds or less.
- Compress the hero image and serve it as WebP or AVIF at the displayed size.
- Don't lazy-load it; add
fetchpriority="high"instead. - Reduce render-blocking CSS and JavaScript in the
<head>. - Improve server response time with caching or a CDN.
Interaction to Next Paint (INP)
INP measures how quickly the page responds when someone clicks, taps or types. Good is 200 ms or less. It can only be measured with real users.
- Remove third-party scripts you don't need.
- Defer non-critical JavaScript.
- Break up long tasks in your own code.
Cumulative Layout Shift (CLS)
CLS measures unexpected movement. Good is 0.1 or less.
- Set width and height on images and embeds.
- Reserve space for banners, cookie notices and ads.
- Use font loading strategies that avoid large reflows.
Lab data vs field data
Lab tests (Lighthouse) run once on a simulated device — useful for debugging, but they vary run to run. Field data from the Chrome UX Report reflects real visitors over 28 days. When both exist, trust field data for the verdict and use lab data to find causes.