WooCommerce stores often suffer from speed problems caused by plugin bloat, shared hosting limitations, and unoptimised WordPress themes. A migration to Shopify is an opportunity to reset — Shopify's infrastructure is significantly more performant than typical WooCommerce shared hosting. However, a misconfigured Shopify store can still be slow: excessive apps, unoptimised images, and poorly coded themes will make even Shopify perform badly. This guide covers post-migration speed optimisation for Shopify stores.

Why WooCommerce stores are often slow

Shared hosting: most small WooCommerce stores run on shared cPanel hosting with limited CPU and RAM
Plugin overhead: 20–40 plugins is common. Each plugin loads PHP code, database queries, and often a JavaScript/CSS file on every page load
WordPress database: uncached WooCommerce queries can be slow, especially product category pages with many filters
Theme bloat: premium page-builder themes (Divi, Avada) load 300–500KB of CSS and JS even before your custom code
Unoptimised images: WordPress doesn't automatically convert to WebP or serve responsive images optimally without plugins

Shopify's built-in speed advantages

Global CDN: Shopify uses Fastly CDN — every page and asset served from edge nodes close to the visitor
Automatic image optimisation: Shopify automatically converts uploaded images to WebP format and serves the appropriate size based on the device
HTTP/3 and TLS 1.3: Shopify stores use modern protocol stack by default — no hosting configuration required
Server-side rendering: Shopify Liquid pages render server-side with caching — product pages are typically served from cache, not re-rendered per request
No database overhead for page visits: unlike WordPress which queries the database on each request, Shopify caches rendered HTML and serves from CDN

Core Web Vitals on Shopify

Largest Contentful Paint (LCP)

Target: under 2.5 seconds. LCP is typically the hero image on the homepage or product main image on product pages.
Hero image optimisation: hero images should be served at the correct size for the viewport. Avoid using a 3000px image for a 1440px hero. In theme, use Shopify's image_url filter with width parameter: {{ image | image_url: width: 1500 }}.
Preload LCP image: add <link rel="preload" as="image" href="..."> in the theme head for the hero image. Many themes do this automatically.
Avoid lazy loading the LCP image: do NOT add loading="lazy" to the hero/LCP image. Lazy loading delays the LCP element.

Cumulative Layout Shift (CLS)

Target: under 0.1. CLS is caused by elements moving after initial render — typically images without declared dimensions, web fonts loading and shifting text, or dynamically injected content (banners, cookie notices).
Image dimensions: always declare width and height on <img> tags. Shopify's image_url includes natural dimensions — use them.
Font loading: web fonts cause layout shift if they swap from fallback font to web font mid-render. Use font-display: optional or font-display: swap with close fallback metrics.
App-injected content: apps that inject banners, chat widgets, or review badges often cause CLS. Check which apps contribute to layout shift using Chrome DevTools Layout Shift Regions.

Interaction to Next Paint (INP)

Target: under 200ms. INP measures responsiveness to user interactions (clicks, taps). Poor INP is typically caused by heavy JavaScript execution blocking the main thread.
App scripts: review apps (Yotpo, Judge.me), loyalty apps, and live chat are common INP culprits. Audit which scripts are running on product pages.
Shopify theme scripts: some theme features (quick-add to cart, variant swatch JavaScript) can be heavy. Profile with Chrome Performance panel.

Image optimisation beyond Shopify defaults

Upload at correct resolution: upload images at 2x the intended display size (for retina screens), not 10x. A product image displayed at 600px wide should be uploaded at 1200px, not 3000px.
JPEG vs PNG: product photos should be JPEG (smaller file size). Logos and graphics with transparency should be PNG. Shopify converts to WebP automatically for supported browsers.
Alt text: every product image should have descriptive alt text. In Shopify, set alt text on each image in the product editor.
Responsive images: use Shopify's srcset pattern in theme templates: {{ image | image_url: width: 800 }} 800w, {{ image | image_url: width: 1200 }} 1200w
Video: product videos should be hosted on Shopify (preferred) or embedded from YouTube/Vimeo (not self-hosted video files). Self-hosted video dramatically increases page weight.

App audit: the biggest speed lever

Every Shopify app that loads JavaScript on the storefront adds to your page load time. A typical over-appified store has 10–20 apps injecting scripts:

Audit step 1: install Shopify's Theme Inspector Chrome extension — shows which scripts each app is loading
Audit step 2: run your store through PageSpeed Insights and GTmetrix — check "Reduce unused JavaScript" and "Reduce unused CSS" recommendations
Common offenders: live chat (Tidio, Gorgias), review apps (Yotpo — especially heavy), loyalty apps (Smile, LoyaltyLion), popup apps (Privy, Klaviyo popups), countdown timers
Deactivate unused apps: if you installed an app to test and didn't uninstall it, it may still be loading code. Uninstall entirely (don't just disable)
Lazy-load non-critical apps: configure review apps and loyalty widgets to load after the main content renders. Most apps have a setting for deferred loading or async script injection.
Replace heavy apps: if a review app scores poorly on performance, consider a lighter alternative. Judge.me is significantly lighter than Yotpo on page load impact.

Theme performance

Use a lean theme: Dawn (Shopify's free theme) is highly optimised. Premium themes vary significantly. Check the theme's PageSpeed score before purchasing — many theme developers now publish speed benchmarks.
Unused sections: if your theme includes sections you never use (FAQ, testimonials slider, countdown timer), disable or remove them. Unused sections may still load their JavaScript.
Minification: Shopify automatically minifies theme JavaScript and CSS in production. Do not add duplicate minification in theme code.
Custom fonts: loading web fonts from Google Fonts or other external hosts adds DNS lookup + download time. Self-host fonts in your theme for better performance, or use system fonts for non-brand-critical elements.
Render-blocking: avoid synchronous <script> tags in the <head>. All theme scripts should use defer or async attributes.

Collection page performance

Collection pages with many products can be slow to render: use pagination (Shopify default: 20–50 products per page) rather than infinite scroll for large collections
Filter apps: filtering apps (Boost Commerce, Searchanise) add significant JavaScript. Test speed before and after installation.
Product card images: product thumbnails in collection grids are usually the heaviest asset. Use lazy loading on all product card images except the above-the-fold row: loading="lazy" on all cards except the first row.
Swatches: colour swatch scripts can be heavy. Profile swatch functionality impact before implementing.

Speed testing tools

Shopify Speed Score: Online Store → Themes → your theme — shows Shopify's speed score (based on Google Lighthouse). Target 50+, ideal 70+.
PageSpeed Insights: pagespeed.web.dev — test mobile and desktop separately. Focus on mobile (lower scores, more representative of real user experience).
GTmetrix: gtmetrix.com — detailed waterfall of every resource loaded. Identify which apps are adding the most weight.
WebPageTest: webpagetest.org — most detailed performance test. Choose a server location matching your target market.
Shopify Analyzer: ecommerceanalytics.io/shopify-speed-test — Shopify-specific speed analysis.

Speed optimisation checklist

Run PageSpeed Insights on homepage, a collection page, and a product page — record baseline scores
Audit all installed apps — uninstall any not actively being used
Check which apps load scripts on storefront pages — disable script injection for apps that don't need it
Review hero image resolution — ensure it's not excessively large
Add preload for LCP image in theme head
Verify no lazy loading on hero/LCP images
Check image dimensions declared in HTML — fix any missing width/height attributes
Audit web font loading — switch to font-display: swap with close fallback metrics
Enable lazy loading on product card images (except first row)
Check Shopify Speed Score in theme dashboard — target 50+
Run GTmetrix waterfall — identify top 3 heaviest resources and address each
Re-run PageSpeed after changes — document improvement

The WooCommerce-to-Shopify migration is one of the few moments where you have a clean slate on performance. WooCommerce stores accumulate performance debt gradually — plugins added over years, a theme replaced but legacy stylesheets kept, database tables from deactivated plugins. At migration, that slate is wiped. The mistake most stores make is immediately recreating all their WooCommerce apps in Shopify — adding 15 apps in the first week. Instead, run on the minimum viable app stack for 30 days, measure your speed scores, and add apps one at a time, testing the speed impact after each. This approach gives you a store that stays fast rather than gradually degrading — and the discipline to remove an app that isn't delivering enough value to justify its performance cost.

Shopify store speed optimisation after WooCommerce (2026)