Core Web Vitals are Google’s three measures of real-world page experience: how fast the main content appears, how quickly the page reacts to input, and whether the layout jumps around. They are part of the page experience signals Google Search uses, and more importantly they track closely with whether visitors stay, read and buy.
What are the three Core Web Vitals and their thresholds?
- Largest Contentful Paint (LCP) measures loading: the time until the largest image or text block in view is rendered. Good is 2.5 seconds or less; poor is over 4 seconds.
- Interaction to Next Paint (INP) measures responsiveness: the delay between a tap, click or key press and the next visual update, across the visit. Good is 200 milliseconds or less; poor is over 500 milliseconds. INP replaced First Input Delay as a Core Web Vital in March 2024.
- Cumulative Layout Shift (CLS) measures visual stability: how much visible content moves unexpectedly. Good is 0.1 or less; poor is over 0.25.
Lab scores versus field data
Google assesses each metric at the 75th percentile of real visits, separately for mobile and desktop, using the Chrome User Experience Report, which reflects a rolling 28-day window. A perfect Lighthouse score on a fast laptop does not guarantee good field data from mid-range phones on mobile networks. Use Lighthouse to diagnose and PageSpeed Insights or Search Console’s Core Web Vitals report to see what users actually experience.
How to fix a slow LCP
- Serve the hero image in a modern format such as AVIF or WebP, sized for the screen, and never lazy-load it.
- Mark the LCP image as high priority (fetchpriority="high") so the browser requests it early.
- Reduce server response time with caching and a CDN; a slow first byte delays everything after it.
- Remove render-blocking scripts and inline only the critical CSS.
How to fix a poor INP
- Break up long JavaScript tasks so the main thread can respond between them.
- Audit third-party scripts such as chat widgets, tag managers and A/B testing tools; they are a common cause.
- Show immediate visual feedback on interaction and defer heavy work until after the next paint.
- Avoid re-rendering large parts of the page for small state changes.
How to fix layout shift (CLS)
- Set width and height, or an aspect ratio, on every image, video and embed.
- Reserve space for banners, ads and cookie notices instead of pushing content down when they load.
- Load web fonts with a matching fallback so text does not reflow when the font arrives.
Make performance a habit, not a project
Scores drift as new features, images and marketing tags are added. Set a performance budget, check it in your deployment pipeline, and review field data monthly. It is far cheaper to keep a site fast than to rescue a slow one.
