Keep your store fast: images, apps and theme code

Before you start

Shopify measures store speed with three Core Web Vitals¹:

• Largest Contentful Paint (LCP) measures loading speed. Good is 2,500 ms or less².
• Interaction to Next Paint (INP) measures how fast the page responds to clicks and taps. Good is 200 ms or less².
• Cumulative Layout Shift (CLS) measures how much content jumps around. Good is 0.1 or less².

The numbers come from real visitors, not a simulated test. Your score combines your home page, your most visited product page and your most visited collection page¹. Shopify reports the 75th percentile, because search engines like Google want at least 75% of page loads to be Good on all three metrics¹.

You need the Reports staff permission to see the reports. A store in private mode (password protected) or a brand-new store may show no data². Shopify does not say which plans include these reports.

Theme code, apps, images, videos, carousels, social media feeds and analytics tags can all slow a store down³. This guide works through them in that order of effort.

Steps

1. Read your performance summary. From your Shopify admin, go to Online Store. The Themes page shows the summary. Use the date picker to choose Today, Last 7 days or Last 30 days². Note which metric is Moderate or Poor.
2. Open the report for the weak metric. Click the metric, for example LCP P75 (ms), to open its Over Time report. The chart marks store changes such as app installs and theme updates, so you can see if a drop followed one of them².
3. Find the slow templates and pages. Go to Analytics > Reports and type a colon (:) in Search reports to list every web performance report. Open the Page Type report to find slow templates, then the Page URL report to find slow pages². If your traffic is low and the numbers jump around, switch to a weekly or monthly view².
4. Make a backup copy of your theme. Go to Online Store, click the three-dot menu next to your theme and select Duplicate⁴. The copy appears as "Copy of" plus the theme name. A store can hold 20 themes, so delete one first if you are at the limit⁴.
5. Remove apps you don't need. For each app, ask whether it adds enough value to cover its speed cost³. To remove one, go to Settings > Apps, open the app's three-dot menu, select Uninstall and confirm⁵. Uninstalling does not remove code the app added to your theme, so check the app's listing or ask its developer for removal steps first^5,3.
6. Review app embeds in your theme. Go to Online Store > Edit theme, then click the App embeds icon in the sidebar⁶. Each embed has a toggle, and embeds can be turned on or off in the theme editor. Click Save after any change⁶.
7. Resize and replace large images. Upload images sized to how they are shown, use JPG for photos and PNG for graphics that need transparency³. To swap a file, go to Content > Files and click the Replace icon next to it. The new file must be the same format⁷. Shopify accepts images up to 20 MB and 25 megapixels, but smaller files load faster^7,3.
8. Cut extra sections and animations. Templates with many sections can perform worse. Remove sections that don't help sales, and compare your reports before and after you turn on page transitions or other animations³.
9. Turn on pagination for large collections. If a collection has many products, use pagination so fewer products load at once³. The setting is in your theme, so where it appears depends on the theme.
10. Audit tracking and third-party code. Check your tag manager and remove unused or low-value tags. Review any third-party code you pasted into the theme by hand³. Poor INP usually comes from too much JavaScript in theme, app or tag code³.
11. Consider a newer theme. If your theme itself is the problem, Shopify suggests an up-to-date Online Store 2.0 theme or one from its Horizon family³. Re-activate your app embeds in the new theme, because they are not on by default after a switch⁶.

Check your work

• Open the Over Time report for the metric you worked on. Look for your change in the annotations and watch the line over the following days. Data can be up to 36 hours late².
• Run a slow page through PageSpeed Insights, which Shopify lists as a tool for checking single pages³.
• Load your slowest pages on a phone and on a different connection, and ask someone else to try too³.
• Click through the pages that used a removed app and confirm nothing is broken or blank.

Common problems

• "The performance summary is empty." Your store may be in private mode or have too little traffic. Remove password protection to collect real visitor data^2,1.
• "My score didn't change after I fixed things." Metrics may not change right away, and data can be delayed by up to 36 hours². Your device, network and location also affect results and are outside your control².
• "PageSpeed Insights shows a different number." PageSpeed Insights uses Chrome data from opted-in users. Shopify's reports use a broader set of browsers. Safari visitors are not measured yet¹.
• "I uninstalled an app but the store is still slow." The app may have left code in your theme. Contact the app developer for removal steps^5,3.
• "The page stays blank, then loads all at once." A slow script is likely blocking it. Use your browser's developer tools to find it, then contact the app or theme developer³.

Further reading

• Improving your online store performance³
• Web performance reports²