Shopify speed: what you can change and what to ask

What the data shows

The 2025 Web Almanac's ecommerce chapter compares store platforms using real-visitor data. For Shopify, on mobile:

• 86% of stores had a good Largest Contentful Paint;
• 90% had a good Interaction to Next Paint;
• 92% had a good Cumulative Layout Shift;
• 76% passed all three.

On desktop the all-three figure was also 76%. In the Lighthouse lab data the median performance score was 55 on mobile and 71 on desktop. For comparison, 35% of mobile WooCommerce stores passed all three. See WooCommerce speed.

The Almanac describes Shopify as a software-as-a-service platform: the platform controls the code base and takes care of hosting. It adds that tighter platform control can correlate with better median outcomes, and that the gap is not destiny. Two Shopify stores can still differ a lot, because the theme, the apps and the content differ. Shopify was about 21% of detected ecommerce sites in the data.

What Shopify decides and what you decide

You cannot tune a server or choose a cache here, so the levers are on the right-hand side.

What a fast theme looks like

Shopify publishes a reference theme called Dawn. It is useful here because it states the rules it follows, and you can compare your theme with them.

The principles in Dawn's contribution guide:

• Web-native. Use what the browser provides. No frameworks, libraries or extra dependencies in the theme.
• Lean, fast and reliable. The targets are zero Cumulative Layout Shift, no changes to the page structure before the visitor acts, no scripts that block rendering, and no long tasks.
• Server-rendered. Pages are built by Shopify's servers using the Liquid language. Parts of the page may load later, but sparingly.

You can see these rules in its code:

• Scripts use `defer`. The theme's scripts are loaded with defer, so they do not block the page. See script loading.
• Fonts show text at once. Dawn writes its font rules with font-display: swap, preloads the main fonts and opens a connection to Shopify's font host early. See web fonts.
• Some styles load without blocking. Styles for parts that are not needed immediately, such as the cart items, are loaded with the media="print" trick and switched on after loading. See critical CSS.
• The first banner gets priority. The image banner marks its image fetchpriority="high" when the section is the first on the page, and leaves it at the default otherwise.
• Product images are sized. Product cards list several widths in srcset, from 165 to 1,066 pixels in the version we read, with a sizes value that matches the grid. They are lazy-loaded unless a developer turns that off. See srcset and sizes.

What Shopify's theme checker flags

Shopify's Theme Check is a tool that lints a theme's code. Its performance rules, with their default settings, are a handy list to ask a developer about:

The Dawn guide recommends running Theme Check, from the editor or with the shopify theme check command. A theme that fails these tests is not necessarily slow, but each failure is a question to ask.

Apps and scripts

The apps you install are the part of a store's speed that you add after the theme. Many add scripts, styles or widgets to your pages. Theme Check even has its own size check for the scripts of app blocks, with the same 10,000 byte default.

A process that works:

1. List every app and what it does. Note which ones show something on the store and which only work in the background.
2. Remove the ones you do not use. Then check the theme's code for leftovers, because an app may have added snippets to the theme files. The app's documentation should say what it installs.
3. Test each remaining app. Duplicate the theme, switch the app's blocks off in the copy, and compare the results. See third-party scripts.
4. Question the overlap. Two review apps, two pop-up tools, or an app that does what a theme setting already does.
5. Look at tags added in settings. Marketing pixels and analytics add scripts too. Keep the ones that someone reads reports from.

Run the audit and look at 3rd parties. Each entry is a company whose code runs on your page.

Images and media

Product pages are mostly images, and a collection page shows dozens.

• Upload originals that are large enough, and no larger. Dawn asks for its images at set widths: up to 3,840 pixels for a large banner, and up to 1,066 for a product card. It lists a width in srcset only when the original is at least that wide. So an original smaller than the biggest width is never stretched, and one far larger adds nothing. See image optimization.
• Check the first image. The main image of a product, or the hero banner, should not be lazy-loaded and should have high priority. A good theme does this for the first section. Check yours with how to fix a slow LCP.
• Watch sliders and videos. A banner slider that loads every slide, or a background video, is costly on a phone.
• Give images dimensions. A theme that follows the checks above does, and so should any section you add.

Collections and search

Showing many products on a page makes the server work harder and the page bigger. The pagination check says its aim is to keep response times low. Keep the number of products per page reasonable, and consider whether infinite scroll and big filters are worth their scripts.

How to measure a store

• Test the main page types: the home page, a collection, a product and the cart, on a phone profile, with the median of several runs. See why scores change.
• Compare on a copy of the theme. Duplicate the live theme, make the change there, and test both. That is safer than editing the live one.
• Look at real-visitor data when the store has enough traffic. See the Chrome UX Report.
• Test after changes to apps. Every install or removal can move the numbers.

Mistakes to avoid

• Installing an app for a small feature. Check whether the theme already has it.
• Leaving removed apps' code in the theme.
• Editing the live theme. Work on a duplicate.
• Chasing the score on the home page only. Product and collection pages carry the traffic.
• Adding a heavy theme feature "just in case". Dawn's principle is that features default to no until they earn their place.

Check your own page

Run the free audit on a product page and a collection page. Open 3rd parties, Reduce unused JavaScript, LCP request discovery and Improve image delivery. Match the largest scripts to apps or tags, and check that the main image is not lazy-loaded.

Sources

• Ecommerce chapter, Web Almanac 2025: platform types, Core Web Vitals pass rates, Lighthouse medians and share of detected stores.
• Dawn, Shopify's reference theme: its README and contribution guide with the theme code principles, and the files layout/theme.liquid, sections/image-banner.liquid and snippets/card-product.liquid.
• Theme Check: the source of the performance checks and their default thresholds, such as asset-size-javascript, asset-size-css, parser-blocking-script, img-width-and-height, asset-preload, remote-asset and pagination-size.