How to Fix Every Core Web Vitals Issue
The Core Web Vitals checker measures the three metrics Google uses as ranking signals: LCP (loading), INP (interactivity, replaced FID in 2024), and CLS (visual stability). Plus the supporting metrics โ TTFB, FCP, TBT. Failing CWV doesn't just cost rankings; it costs conversions. This index covers fixes for every category.
By finding type
Each metric has different root causes and fixes:
๐ผ๏ธ Fix slow Largest Contentful Paint (LCP) PLANNED
Hero image lazy-loaded (don't), preload the LCP element, defer below-the-fold images, the fetchpriority="high" attribute, server response time, render-blocking CSS. Target: under 2.5s on 75th percentile.
๐ฑ๏ธ Fix poor Interaction to Next Paint (INP) PLANNED
JS event handlers blocking the main thread. Break long tasks, debounce expensive handlers, move computation to Web Workers, virtualise long lists. Target: under 200ms. INP replaced FID as a Core Web Vital in March 2024.
๐ Fix layout shift (CLS) PLANNED
Images without width/height, web fonts loading late, ads injected after content, late-loading components reshaping the page. Target: under 0.1. The font-display strategy, image dimension auto-fill, and ad-slot reservation.
โฑ๏ธ Fix slow Time to First Byte (TTFB) PLANNED
TTFB over 800ms hurts every downstream metric. CDN, server geography, database query optimisation, edge caching, the move from origin-render to pre-rendered HTML. Target: under 600ms.
๐จ Fix slow First Contentful Paint (FCP) PLANNED
Critical CSS inline, defer non-critical CSS, minimal blocking resources in <head>, fast TTFB. FCP precedes LCP so it's the foundation. Target: under 1.8s.
๐งฑ Fix Total Blocking Time (TBT) PLANNED
Sum of all long tasks blocking the main thread during load. Code-splitting, deferred third-party scripts, the consent-gated tracking pattern. TBT is a lab metric; INP is the field equivalent users actually experience.
๐ฑ Fix mobile-specific CWV failures PLANNED
Mobile CWV typically lags desktop by 30-50%. The 3G/4G network throttling, low-end-device CPU realities, the per-bundle byte budget for mobile. Why your dev laptop is lying to you.
๐ Fix CrUX vs lab data mismatch PLANNED
Lighthouse passes; CrUX (real users) fails. The 28-day rolling window means recent fixes take time to reflect. Real-user monitoring (RUM) closes the gap. The interpretation guide for Search Console CWV reports.
By platform
Optimisation patterns by platform:
๐ฐ Fix CWV in WordPress PLANNED
Hosting choice (most impactful), WP-Rocket / Perfmatters configuration, page-builder weight, the move to lightweight themes, image-optimisation plugins that actually help.
๐ Fix CWV in Shopify PLANNED
Theme weight, app-injection bloat (the biggest CWV killer on Shopify), the Online Store 2.0 sections-everywhere overhead, and CDN/edge-rendering wins.
โ๏ธ Fix CWV in Next.js / Nuxt PLANNED
SSG vs SSR vs ISR per page, Image component with priority hints, the next/font story for CLS, and the Edge runtime for global TTFB.
What our Core Web Vitals checker checks
The checker pulls field data (CrUX) and lab data (Lighthouse) for your URL, breaks down each metric with diagnostic recommendations, identifies the specific assets and code causing failures, and tracks the 75th-percentile threshold Google uses for ranking. For the full reference, see the Core Web Vitals Guide.
๐ Measure your vitals first
Run the checker. CWV improvements correlate strongly with ranking and conversion lift โ measure, fix, ship.
Run CWV Checker โ