Core Web Vitals Checker — Example Report Run Your Own Audit →
📋 Example Report — Demo Data

Core Web Vitals Example: LCP 3.8s, CLS 0.04, INP 280ms

This example shows a Core Web Vitals audit for an e-commerce product page. LCP is 3.8 seconds — above the 2.5s threshold — caused by a hero image without preloading. INP is 280ms — the main thread is being blocked by third-party scripts. CLS is excellent at 0.04.

Core Web Vitals — product.example.com/shoes/trainers Mobile · Field Data via PSI API
LCP
3.8s
Needs Improvement
Target: <2.5s
CLS
0.04
Good
Target: <0.1
INP
280ms
Needs Improvement
Target: <200ms
Performance
61
Needs Work
/100
LCP — Opportunities to Improve (3.8s → target 2.5s)
CRITICAL

Hero image not preloaded — <link rel="preload"> missing

The LCP element is the hero product image (800×600, 78KB). It is not preloaded, so the browser only discovers it after parsing the full HTML. Adding <link rel="preload" as="image"> in <head> will reduce LCP by approximately 0.8–1.2 seconds.

WARN

Hero image not served in WebP format (78KB JPG)

Serving the hero image in WebP instead of JPEG would reduce it from 78KB to approximately 45KB — a 42% size reduction. Combined with preloading this would bring LCP well under 2.5s.

WARN

Render-blocking CSS from third-party review widget

A third-party CSS file from reviews.example-widget.com is blocking rendering for 380ms. Load it asynchronously or inline critical CSS to unblock rendering.

INP — Long Tasks Blocking Main Thread
WARN

Third-party analytics script blocking for 180ms

The chat widget script (chat.support-widget.com) runs a 180ms long task on page load, blocking user interaction. Load it with the defer attribute and only after the user first interacts with the page.

WARN

Add-to-cart click handler running 140ms synchronously

The add-to-cart button event handler runs 140ms of synchronous JavaScript before responding to the click. Break the work into smaller chunks using setTimeout or requestIdleCallback.

"Needs Improvement" is a fail — the assessment is pass/fail

Two of these three metrics are amber. It is tempting to read that as "mostly fine, some room to improve". It is not how Google scores it.

To pass the Core Web Vitals assessment, all three metrics must be Good. One amber metric fails the page. There is no partial credit, and a CLS of 0.04 — genuinely excellent — earns nothing while LCP sits at 3.8s. This page is not two-thirds of the way to passing. It is failing.

MetricGoodNeeds ImprovementPoor
LCP≤ 2.5s2.5 – 4.0s> 4.0s
INP≤ 200ms200 – 500ms> 500ms
CLS≤ 0.10.1 – 0.25> 0.25

Worth keeping in proportion, though: Core Web Vitals are a real but modest ranking signal, closer to a tiebreaker than a lever. A slow page with the best answer will generally outrank a fast page with a worse one. Fixing this matters — and it will not rescue a page nobody wants to read.

What "field data" means, and why it changes everything

The header says Field Data via PSI API, and that is the single most important label on this report. These numbers are not a simulation. They come from the Chrome User Experience Report — real Chrome users, on their real phones, on their real networks.

Three consequences that determine how you act on it:

This also explains the classic disagreement: a page can pass in Lighthouse and fail here. Lighthouse is one synthetic load in a data centre. This is what happened to actual people. When the two conflict, this one is the one Google uses.

Diagnosing INP 280ms: three phases, three different fixes

INP replaced FID in March 2024, and it is a far harder test. FID measured only the delay before an interaction began being processed. INP measures the whole thing — from the tap until the screen actually updates. It also considers every interaction across the page's life, not just the first.

Every interaction decomposes into three phases, and the report has found problems in two of them:

PhaseWhat it isThe finding here
1. Input delayThe main thread was already busy when the tap arrivedThe chat widget's 180ms long task
2. Processing timeYour event handler runningThe add-to-cart handler's 140ms of synchronous work
3. Presentation delayRe-layout and paint after the handler finishesNot flagged — but a large DOM update lands here

These need opposite fixes. Input delay is fixed by not running third-party code during load — the chat widget has no business executing before the user has done anything. Processing time is fixed by yielding: break the handler's work into chunks so the browser can paint between them, rather than blocking for 140ms and then painting once.

why

Why yielding works

The browser cannot paint while your JavaScript is running. A handler that does 140ms of work in one block gives the user 140ms of nothing — a button that appears dead. The same work, broken into chunks with yields between them, lets the browser paint the button's pressed state immediately and finish the work afterwards. The total work is identical. The perceived responsiveness is completely different, and INP measures the perception.

Why an e-commerce product page fails INP so reliably

This is not bad luck. A product page is where third-party JavaScript accumulates, and third-party JavaScript is what breaks INP.

Count them on any real store: analytics, a tag manager, a chat widget, a review platform, a recommendation engine, a personalisation script, an A/B testing tool, a heatmap recorder, a consent manager, a currency converter, and three advertising pixels. Each one runs on the same single main thread that has to respond when someone taps Add to Cart.

The revenue argument writes itself on a product page: the interaction being delayed by 280ms is the add-to-cart button. This is not an abstract quality metric.

The LCP fix, in the right order

The report names three LCP opportunities. They are not equally valuable and they should not be done in the order listed — do them in this order:

  1. Preload the hero image. Biggest win, smallest change. Without it, the browser only discovers the image after parsing the HTML and, frequently, after the CSS has parsed too. A <link rel="preload" as="image"> in the head means the preload scanner finds it in the first bytes of the document. Add fetchpriority="high" to the image itself so it queues ahead of everything else.
  2. Unblock the third-party review CSS. 380ms of render-blocking, from a domain you do not control, requiring its own DNS lookup, TCP handshake and TLS negotiation before the first byte. Nothing about a review widget needs to block the first paint of a product page.
  3. Then the WebP conversion. 78KB to 45KB is real and it is the smallest of the three. Compressing an image the browser has not been told about yet does not fix the fact that it has not been told about it.
check

Confirm the LCP element before optimising anything

The report identifies it as the hero image. Always verify this yourself — people routinely spend a week optimising an image that was never the LCP element, and are baffled when nothing moves. And whatever the LCP element is: never give it loading="lazy". Lazy-loading is correct below the fold and actively harmful on the element whose paint time is being measured.

Frequently asked questions

What are Core Web Vitals?

Core Web Vitals are three performance metrics Google uses as ranking signals: LCP (Largest Contentful Paint) measures loading speed, CLS (Cumulative Layout Shift) measures visual stability, and INP (Interaction to Next Paint) measures responsiveness. Good scores are LCP under 2.5s, CLS under 0.1, INP under 200ms.

How does LCP affect SEO?

LCP is a direct Google ranking factor. Pages with LCP above 4 seconds receive a Poor rating and rank lower than faster competitors. Improving LCP involves preloading the hero image, eliminating render-blocking resources and using a fast CDN.

What causes Cumulative Layout Shift?

CLS is caused by elements moving unexpectedly after the page loads — usually images without defined dimensions, ads that load late, web fonts that swap, or dynamically injected content. Reserve space for all dynamic content using CSS aspect-ratio or min-height.

Two metrics are amber and one is green. Does the page pass?

No. All three metrics must be Good for a page to pass the Core Web Vitals assessment — there is no partial credit. An excellent CLS earns nothing while LCP sits above 2.5s. Keep it in proportion, though: Core Web Vitals are a real but modest ranking signal, closer to a tiebreaker than a lever, and a fast page with a worse answer will still generally lose to a slow page with a better one.

Is 3.8s what most of my visitors experience?

No — it is the 75th percentile of real visits, not the average. The median visitor may be well under it; the slowest quarter, on older phones and worse connections, are at 3.8s or beyond, and they are who the threshold exists to protect. Note also that the field data is a 28-day rolling window, so a fix deployed today will not be fully reflected for about four weeks, and low-traffic URLs with no field data of their own inherit origin-level figures from the site as a whole.

How do I diagnose a poor INP score?

Break the interaction into three phases, because they need opposite fixes. Input delay means the main thread was already busy when the tap arrived — fix by not running third-party code during load. Processing time is your own event handler blocking — fix by yielding, so the browser can paint between chunks of work rather than after all of it. Presentation delay is the re-layout and paint afterwards, usually caused by a large DOM update.

Why do e-commerce product pages fail INP so often?

Because they accumulate third-party JavaScript — analytics, tag manager, chat, reviews, recommendations, personalisation, A/B testing, heatmaps, consent, and advertising pixels — and every one of them runs on the same single main thread that must respond when someone taps Add to Cart. Third-party code cannot be optimised, only deferred or removed. Audit the tag manager first; there is nearly always a pixel from a campaign that ended years ago, still executing on every page view.

Related Demo Reports

Run Core Web Vitals Checker on Your Own Site

Get your real audit report with specific issues, fixes and actionable improvements.

⚡ Run Free Audit View Plans