Core Web Vitals for Shopify

Shopify takes care of the parts of web performance that merchants on other platforms struggle with: hosting, a global CDN, image resizing and the checkout. Server response time is rarely the problem on a Shopify store. What decides the Core Web Vitals is what the merchant adds on top: the theme, the apps, the images and the tracking. This guide uses PerfDelta's measurements of Shopify stores to show where they stand, why the stores that fail usually fail, and what a merchant can change without touching the platform.

From PerfDelta's measurements: 59% of the 280 measured Shopify websites pass all three Core Web Vitals (all measured websites: 49%). 81% have a good LCP, 74% a good INP and 80% a good CLS. All values, other platforms and regions are in the Shopify speed statistics. More in the data section below.

Where Shopify stores stand

In our measurements, Shopify stores pass the Core Web Vitals more often than the average website, and at the same time they are among the heaviest pages we see. Both come from the same place: a platform that renders fast and serves images well, combined with merchants who add hero videos, app scripts and marketing pixels on top. The data section below gives the current pass rate and metric distribution; the Shopify speed statistics page adds page weight, the most common third parties and the Lighthouse findings, including a regional comparison for Germany, Austria and Switzerland and the UK.

What typically slows Shopify stores down

Apps

Every reviews widget, upsell tool, wishlist, size guide, chat launcher and back-in-stock app injects a script into the theme, and most of them load on every page whether their feature appears there or not. Ten apps are ten scripts competing with the product image and the add-to-cart button for the main thread. This is the single biggest cause of a poor INP on Shopify.

Images and video in the hero

Shopify's image CDN resizes and converts images, but only if the theme requests the right sizes. Full-width hero images at the maximum width, slideshows with every slide loaded, and autoplaying background videos set the LCP late and the page weight high.

Theme JavaScript and render-blocking assets

Older or heavily customized themes load jQuery, a slider library and the theme bundle synchronously in the head. Newer themes from the theme store are far leaner, but years of customizations and "temporary" snippets add up. Render-blocking resources are the most common Lighthouse finding on Shopify stores in our data.

Tracking and marketing pixels

Google Tag Manager, Meta and TikTok pixels, Klaviyo, Microsoft Clarity and an A/B testing tool are a typical set. Each is small on its own; together they are often the largest share of main-thread time. See third-party code.

Layout shifts from late-loading elements

Announcement bars, cookie banners, review stars that render after the API answers, and product images without aspect ratios push content down after the first paint and raise CLS.

Fixes a merchant can make

1. Audit the apps. List every installed app, note which pages its feature actually appears on, and uninstall what is unused. After uninstalling, check the theme code for leftover snippets; apps do not always clean up. For the apps that stay, prefer those built on Shopify's theme app extensions, which load only where the block is placed.
2. Fix the hero. One image, sized for the viewport with srcset, in WebP or AVIF, with fetchpriority="high" and no lazy loading. Replace autoplay video with a poster image and a play button. Current theme-store themes do this out of the box; check that customizations did not undo it.
3. Lazy-load everything below the fold. Product grids, slideshows beyond the first slide, and footer content. Most themes support loading="lazy" on collection images; the offscreen images guide has the details.
4. Load tracking late. Move marketing pixels into Shopify's customer events (web pixels) or the tag manager with triggers that fire after load, and keep the consent tool lightweight. Avoid A/B testing tools that hide the page until they run.
5. Reserve space for dynamic elements. Give announcement bars, review widgets and app blocks a fixed height or min-height, and product images an aspect-ratio, so late content does not shift the layout.
6. Update or replace the theme. If the theme is several years old or carries many customizations, moving to a current theme-store theme and re-applying only the customizations that still matter removes most render-blocking and unused code in one step.
7. Keep the Shopify font library and preload the primary font. Shopify serves its fonts with font-display: swap; custom fonts added to the theme need the same treatment (font-display guide).

Measuring the result

Test the home page, a collection page and a product page separately; the product template usually carries the most apps. Watch INP in the field most closely, because it reacts to app scripts, and compare each store against the Shopify medians on the platform page rather than against the web as a whole.

Frequently asked questions

Why does my Shopify store have a low Lighthouse score but pass Core Web Vitals?

The mobile lab test simulates a slow phone, where app scripts and heavy images cost seconds. Real shoppers tend to have faster devices, so the field data looks better. The score still points at real problems: the same scripts hurt shoppers on cheaper phones.

How many apps are too many?

Count scripts, not apps. Apps built on theme app extensions that load only where used are cheap; apps that inject a script on every page are not. Ten or more script-injecting apps is a common pattern on stores that fail INP.

Can I speed up Shopify's checkout?

The checkout is hosted and optimized by Shopify. What you control is the path to it: product and cart pages. Focus on those.

Does a Shopify speed score matter?

Shopify's own speed score is a Lighthouse-based lab number for a set of pages. Use it like any lab score, as a diagnostic, and judge the store by its Core Web Vitals field data.