Core Web Vitals on Vercel: LCP, INP and CLS explained
What LCP, INP and CLS measure, the thresholds Google uses, how to turn on Vercel Speed Insights, and what to fix first when a page fails.
Last updated October 21, 2026
The three numbers
Core Web Vitals are three measurements Google uses to judge how a page feels to real visitors, and it counts them in search ranking. Each is taken at the 75th percentile (p75): the value that three in four visits beat. A page passes when all three are in the good range.
| Metric | What it measures | Good | Poor |
|---|---|---|---|
| LCP | Largest Contentful Paint: how long until the main content shows | 2.5s or less | Over 4s |
| INP | Interaction to Next Paint: how long a tap or click takes to respond | 200ms or less | Over 500ms |
| CLS | Cumulative Layout Shift: how much the page jumps while it loads | 0.1 or less | Over 0.25 |
Between good and poor is “needs work”. A page is as good as its worst metric: one poor metric makes the page poor.
Turning on Speed Insights in Vercel
- Enable it for the project: in Vercel, open the project, then Speed Insights, then Enable.
- Add the package to the app:
@vercel/speed-insights, with the component for your framework (for Next.js,<SpeedInsights />in the root layout). - Deploy. Figures arrive as real visitors load the page; a quiet page takes longer to have enough samples.
Speed Insights is separate from Web Analytics: a project can have one without the other, and Vercel bills them apart.
Mobile and desktop fail differently
The p75 over all visitors can hide a problem. Phones have slower processors and networks, so a page can pass on desktop and fail on mobile, often on LCP (a large hero image) or INP (heavy JavaScript). Check the two apart before deciding what to fix, and weigh them by where your visitors are: if most of them are on phones, the mobile figure is the one that matters.
What to fix first
- LCP: Compress the hero image, serve it in WebP or AVIF, preload the font, and avoid blocking scripts above the fold.
- INP: Split heavy JavaScript, defer third-party scripts, and keep click handlers short.
- CLS: Set width and height on images and embeds, reserve space for banners, and keep late-loading fonts from shifting text.
Start on the slowest routes, not the home page: a single heavy landing page can fail while the rest of the site passes. After a fix, watch the trend for a few days; p75 moves only as new visits come in.
Every project at once
Vercel shows Speed Insights one project at a time. Lookout’s Speed Insights view puts every project’s LCP, INP and CLS on one board next to its traffic, per device, with a plain-language verdict and a fix prompt you can paste into Claude Code or Cursor. Core Web Vitals is also one of the factors on the landing-page Scorecard.