Core Web Vitals describe three parts of the experience people have on your Shopify storefront: how quickly the main content appears, how promptly the page responds to interactions and how stable the layout remains. They are useful because they connect performance work to moments your customers actually encounter.
The current metrics are Largest Contentful Paint (LCP), Interaction to Next Paint (INP) and Cumulative Layout Shift (CLS). INP replaced First Input Delay (FID) as a Core Web Vital in March 2024. Older guides that still use FID need that distinction.
LCP: when the main content becomes visible
LCP measures when the largest eligible image or text block visible in the viewport renders. On a Shopify product page, that may be the main product image. On another template, it could be a hero image or heading.
If LCP is slow, identify the element first. Then review its image dimensions, discovery and loading priority, along with resources that delay rendering. Lazy-loading an important image above the fold can postpone the content the shopper needs first. Read our Shopify lazy loading guide before changing every image to the same loading behavior.
INP: how responsive the storefront feels
INP evaluates responsiveness across qualifying interactions during a visit. A customer changing a variant, opening a menu or clicking an add-to-cart button expects visible feedback promptly.
Slow feedback can involve theme code, app scripts, expensive event handlers or work that blocks the browser’s main thread. Investigate the specific interaction on a representative device. Do not remove essential shopping functionality simply to improve a test result.
Total Blocking Time is a lab diagnostic that can help identify blocking work. It is not INP and is not itself a Core Web Vital.
CLS: whether the page stays in place
CLS measures unexpected layout shifts. A review widget appearing late, an image without reserved space or a font swap can move content while someone is reading or trying to tap a button.
Check that images and embeds have appropriate dimensions or reserved space. Review widgets that insert content above existing elements. Test the full page as it loads, rather than judging stability from the finished screenshot.
What counts as good?
- LCP: 2.5 seconds or less.
- INP: 200 milliseconds or less.
- CLS: 0.1 or less.
These thresholds are assessed at the 75th percentile of visits. They are measurement targets, not promises of a particular ranking or conversion rate. Google explains the criteria in its Core Web Vitals thresholds documentation.
Use field data and lab tests for different jobs
Field data describes real visits over a measurement period. Lab tests simulate a visit under controlled conditions and help investigate a particular page. PageSpeed Insights can display both when sufficient real-user data is available.
Shopify’s web performance reports provide another view of storefront measurements. Different reporting windows, devices and data sources can produce different results. A lack of data does not prove a page passes or fails.
Turn the measurements into a work plan
- Choose a homepage, collection and important product page to review.
- Record comparable mobile and desktop tests using our Shopify speed test workflow.
- Identify whether loading, responsiveness or stability is the main problem.
- Make targeted changes on a duplicate theme and test the shopping journey.
- Compare the results, launch safely and monitor real-user data as it becomes available.
New field results take time to replace earlier visits in rolling reports. Keep a dated record of the changes so you can distinguish an implementation problem from a reporting delay.
Get the right kind of help
The ChopChopify App focuses on smarter loading priorities. Our manual optimization plans add hands-on investigation and implementation across your theme, apps and scripts, with a private project dashboard and personalized Speed Report.
Use Core Web Vitals to guide the investigation, then verify that the storefront feels better and its shopping features still work.
Wondering whether your result is good enough? Read what a good Shopify speed score means.