Core Web Vitals in 2026: Developer's Complete Optimisation Checklist
A step-by-step checklist for passing LCP, INP, and CLS based on real-world audits of 120+ production sites.
Passing Core Web Vitals at the 75th percentile for real-user data — not just lab scores — is a ranking prerequisite in 2026. Lab tools like PageSpeed Insights give you a starting point; Chrome UX Report (CrUX) data gives you the truth.
48%
of the top 1,000 global websites still fail at least one Core Web Vital in real-user CrUX data (HTTP Archive 2025)
24%
average conversion rate increase for e-commerce sites moving from “Needs Improvement” to “Good” on Core Web Vitals (Google, 2024)
123%
higher mobile bounce rate for pages with LCP above 4 seconds vs. under 2.5 seconds (Deloitte Digital)
Largest Contentful Paint (LCP)
LCP measures how long the largest above-the-fold element takes to render. The target is under 2.5s. The most common culprits from our 2025 audit data:
- Hero images served without
fetchpriority="high"— add it to your LCP image element - Images served without explicit
width/heightattributes — causes layout shift during load - CSS background images as LCP element — browser can't preload these; switch to
<img> - Render-blocking CSS in
<head>— inline critical CSS; load the rest async - Slow server TTFB — if TTFB exceeds 800ms, fix hosting/CDN before optimising assets
Interaction to Next Paint (INP)
INP replaced FID in March 2024. It measures responsiveness across all page interactions — clicks, taps, keyboard events. Target: under 200ms. INP failures are almost always caused by long JavaScript tasks blocking the main thread:
- Audit with Chrome DevTools Performance panel — look for long tasks (yellow) over 50ms
- Break long tasks with
scheduler.yield()or manually splitting tasks withsetTimeout(0) - Defer non-critical third-party scripts until after user interaction
- Reduce bundle size with code splitting — avoid loading the entire app on page load
- Debounce or throttle scroll/resize event handlers
Cumulative Layout Shift (CLS)
CLS measures visual instability from elements moving after initial render. Target: under 0.1. Common sources:
- Images and videos without explicit dimensions — always set
width/heightin HTML oraspect-ratioin CSS - Dynamically injected content (ads, banners, cookie bars) — reserve space with
min-height - Web fonts causing FOIT/FOUT — use
font-display: optionalfor non-critical fonts - Late-loading JavaScript that injects DOM nodes above existing content
Why Core Web Vitals Failures Are Costing You Revenue
Core Web Vitals are not purely a technical metric — they have a measurable and documented relationship with revenue outcomes. Google’s research across retail and media sites found that improving LCP by 0.1 seconds increased mobile conversion rates by 8%. Deloitte Digital’s analysis of 37 retail and travel sites found that even a 0.1-second improvement in mobile load time correlated with a 10.1% uplift in retail conversion and 10.5% in travel bookings.
The relationship extends beyond e-commerce. B2B sites with high INP scores show elevated form abandonment rates — users drop off before completing lead generation forms when page interactions feel sluggish. For a site generating 200 qualified leads per month, even a 15% INP-driven abandonment rate represents 30 lost leads per month. At meaningful deal values, this vastly outweighs the cost of a performance audit and remediation cycle.
“Speed is not a feature. It is the prerequisite for every other feature to be experienced. Users don’t distinguish between slow performance and broken performance — both result in the same outcome: they leave.”
Measuring Real-User Data
Lab tools (Lighthouse, PageSpeed) measure a single simulated load on fast hardware. Real users are on 4G mobile, older Android devices, in regions with high server latency. This gap is significant — a site that scores 95 on PageSpeed can still fail Core Web Vitals for 30% of real users. Validate with:
- CrUX Dashboard: Google’s free 28-day real-user dataset, queryable by URL
- Search Console Core Web Vitals report: Grouped by Good/Needs Improvement/Poor per URL group
- web-vitals JS library: Instrument your own pages and send to analytics
- Chrome DevTools Performance panel: Throttle to 4G mobile and reproduce issues locally
- WebPageTest.org: Test from real locations and devices globally, free
Setting a Performance Budget
A performance budget is a set of constraints that your site must not exceed — maximum JavaScript bundle size, maximum image payload per page, maximum third-party script load time. Without a budget, performance degrades incrementally and invisibly as features are added: each individual change seems harmless but the cumulative effect fails real users at the exact metrics Google is measuring.
A practical starter performance budget for most commercial sites:
- JavaScript (total parsed): Under 300kb compressed. Every framework, library, and analytics tag counts toward this ceiling.
- Total page weight (desktop): Under 1.5MB. Mobile: under 800kb. Audit monthly — asset weight grows silently with each feature release.
- Third-party scripts: Cap at 5 or fewer active on any page. Audit each quarterly — every third-party script is a potential INP regression.
- LCP image file size: Under 100kb after compression and modern format encoding (WebP or AVIF). Uncompressed hero images are the single most common LCP failure cause.
Enforce performance budgets in CI using Lighthouse CI, Calibre, or SpeedCurve. These tools fail a build if budget thresholds are crossed, preventing performance regressions from reaching production silently — the same principle as security scanning in CI. A team that knows performance will fail the build treats it with the same priority as failing tests.
Third-Party Script Audit: The Hidden Performance Tax
Third-party scripts — chat widgets, analytics platforms, A/B testing tools, retargeting pixels, social proof widgets — are the most common source of INP failures on otherwise well-optimised sites. Each script adds main thread blocking time that accumulates across all active scripts simultaneously. A median commercial site in 2025 loads 22 third-party scripts; the top quartile loads 50+.
Audit third-party scripts using the Chrome DevTools Coverage panel and the Network tab filtered to third-party origins. For each script, answer: Is this script actively used? Does the revenue or engagement impact justify the INP cost it introduces? Can it be loaded conditionally (only on pages that need it) or deferred until after first meaningful interaction? Most marketing teams have added scripts over years without ever removing any. A quarterly audit that removes 3–5 scripts typically produces more INP improvement than weeks of code-level optimisation.
Pre-Launch Core Web Vitals Checklist
Run through this before any public launch or major update:
- LCP image has
fetchpriority="high"and explicitwidth/heightattributes - Critical CSS is inlined; non-critical CSS loads async
- All images and videos have explicit dimensions set in HTML or CSS
- Third-party scripts are deferred or loaded conditionally after user interaction
- Chrome DevTools shows no long tasks over 100ms on page load
- INP measured below 200ms on throttled 4G mobile simulation
- CLS score below 0.1 verified in PageSpeed Insights and CrUX
- Fonts use
font-display: swaporoptionalto prevent FOIT - TTFB below 800ms verified from multiple geographic locations
limestack's engineering team conducts Core Web Vitals audits as part of every web development project. Web Development Services →
Fix Your Performance
Is your site failing Core Web Vitals for real users?
Our engineers run a full performance audit and deliver a prioritised fix list with estimated impact for each change.