core web vitals checker

Core Web Vitals are the three metrics Google uses to decide whether your page delivers a good user experience: Largest Contentful Paint (LCP), Interaction to Next Paint (INP), and Cumulative Layout Shift (CLS). This free checker runs the exact same Lighthouse audit Google's own search team uses, against a real Chromium instance, and returns a score plus the specific opportunities that are dragging it down.

What 'passing' actually means

Google's threshold for a passing page is LCP under 2.5 seconds at the 75th percentile of visits, INP under 200 milliseconds, and CLS under 0.1. The 75th-percentile rule matters: an average that looks great can hide a long tail of slow loads on cheap Android phones over flaky 4G. We surface both the lab number (this single run) and explain how it differs from the field data Google uses for ranking.

LCP — Largest Contentful Paint

LCP is the time from navigation start until the largest above-the-fold element finishes painting. For most pages that element is the hero image, a video poster, or a block of headline text. The most common LCP killers are uncompressed hero images, render-blocking CSS in the <head>, and slow time to first byte from origin servers. Preloading the LCP image with <link rel="preload" as="image"> and serving it from a CDN at the right intrinsic size usually shaves 1–2 seconds in one change.

INP — Interaction to Next Paint

INP replaced First Input Delay in March 2024 because FID only measured the first click on the page. INP measures the latency of every interaction and reports the worst (P98). It catches frameworks that do too much synchronous work on click — React state updates that re-render a 5,000-node tree, third-party tag managers that fire on every tap, expensive event handlers attached to the document. The fix is usually breaking work into smaller tasks with scheduler.yield() or requestIdleCallback, and removing event listeners that don't earn their keep.

CLS — Cumulative Layout Shift

CLS measures how much content jumps around after first paint. The villains are images without dimensions, web fonts that swap and reflow text, late-loading ad slots, and cookie banners that push the page down. Every shift is unsigned and weighted by impact area, so a banner shifting the entire viewport is far worse than a small avatar swapping in. Setting explicit width and height on every image and reserving space for embeds takes CLS from terrible to near-zero in an afternoon.

How this tool fits into ongoing monitoring

One-shot tests catch the obvious regressions. Real ranking requires watching CrUX field data weekly and getting paged the moment a deploy breaks LCP. Lemwatch tracks Core Web Vitals on a schedule, alerts on regressions, and pulls in CrUX so you see what Google actually sees — not just what your laptop on office WiFi sees.

Lab data vs field data — why both exist

Every CWV conversation eventually hits the lab-vs-field distinction. Lab data is what this tool returns: one synthetic run on a known device profile under known network conditions. It's reproducible, fast, and great for catching regressions before they ship. Field data — what Google uses to rank — is collected from real Chrome users over the last 28 days via the Chrome User Experience Report (CrUX), reported at the 75th percentile, and only available for sites with enough Chrome traffic. Lab tells you whether the page CAN pass; field tells you whether it DOES pass for real users. Both matter. A page that passes in the lab but fails in the field usually has a long tail of slow-network or low-end-device users the lab profile doesn't represent. The fix is the same (optimise the page); the diagnostic is different.

Stack-specific fix patterns

Most CWV failures fall into predictable buckets by stack:

• WordPress — page builders (Elementor, Divi) ship 200–500KB of CSS even on pages that don't use 90% of it. Use a critical-CSS plugin, switch to a leaner builder, or bite the bullet and use Gutenberg. The other killer is unoptimised hero images uploaded straight from a phone camera — install an image-CDN plugin.
• Shopify — third-party apps inject scripts on every page. Audit the app drawer ruthlessly; every app you don't use is INP debt. Also: enable native lazy-loading on product images, which Shopify still defaults to off in some themes.
• React SPA / Next.js — hydration is the INP enemy. Migrate marketing pages to Server Components or static export. Defer client-only JS with dynamic() and ssr: false only when you really need it.
• Vue / Nuxt — same hydration story as React. Nuxt 3's <ClientOnly> is great for non-critical widgets; abuse it for analytics.
• Headless commerce (Sanity + Next, Shopify Hydrogen, etc.) — your CWV ceiling is your image CDN's resize speed. Pick a CDN with on-the-fly AVIF support; serve the LCP image as a <link rel="preload" imagesrcset> from the edge.

The hidden cost of failing CWV

CWV is not just a ranking factor. Internal data from Google shows that improving LCP by 0.5 seconds increases conversion rates by 5–15% across e-commerce. INP improvements above 200ms drop bounce by similar amounts. The ranking lift is the smaller half of the value — the conversion-rate lift is the larger half. Treat CWV as a revenue project, not an SEO project, and the business case writes itself.

The most common single-line fix

If you ran this audit and your LCP is bad and you only have time to ship one fix, here it is: add fetchpriority="high" to your hero <img> and loading="eager". For most pages that one attribute pair improves LCP by 200–600ms because it tells the browser to fetch that image before scripts and stylesheets. It's a 90-second change and we've never seen it not help.