How to Fix Slow Shopify Stores: A Performance Checklist

A slow Shopify store is a revenue leak. Every second of load time reduces conversions — and most store owners do not realize how much speed costs them.

The problem is rarely one thing. It is a combination of theme bloat, too many apps, unoptimized images, and third-party scripts that compound into a slow experience.

This checklist covers the real causes and the fixes that actually work.

# How Slow Is Your Store?

Before fixing anything, measure the baseline. Use these tools:

1. Google PageSpeed Insights → https://pagespeed.web.dev
2. GTmetrix                  → https://gtmetrix.com
3. WebPageTest               → https://webpagetest.org
4. Shopify Theme Inspector   → Built into Shopify admin

# Key Metrics to Track

Record these numbers. You will compare them after each fix.

# The Performance Checklist

# 1. Theme Assessment

The theme is the foundation. A bloated theme means everything built on top of it is slow.

Check for:

• Theme age — older themes use Liquid rendering patterns that are slower than Shopify 2.0 JSON templates
• Unused sections — every section loads its CSS and JavaScript regardless of whether it is visible
• Hero sliders — carousels are one of the worst performance offenders. A static hero image loads faster and converts better
• Custom fonts — each font weight is a separate file download. Limit to 2 weights maximum
• Built-in features — some themes include features (quickview, mega menus, animations) that duplicate what apps do, leading to double-loading

Fixes:

✓ Switch hero carousel to a single static image with text overlay
✓ Remove unused theme sections from templates
✓ Limit fonts to 2 weights (regular + bold)
✓ Prefer system fonts for body text — load custom fonts only for headings
✓ Disable built-in features you are replacing with apps

# 2. App Audit

Every Shopify app injects its own JavaScript and CSS into your storefront. Even "lightweight" apps add 50–200 KB each.

The audit process:

1. List all installed apps
2. Check which apps inject storefront scripts (not all do)
3. For each app:
   - Is it actively used?
   - Is there a built-in Shopify feature that replaces it?
   - Can it be replaced with a lighter alternative?
4. Uninstall anything unnecessary
5. After uninstalling: check for leftover code in theme files

Common culprits:

Important: Uninstalling an app does not always remove its code. Check theme.liquid, snippets/, and assets/ for leftover script tags.

# 3. Image Optimization

Images are usually the largest files on any page. On Shopify, they are also the easiest to fix.

Check for:

• Images larger than 200 KB
• Images served as PNG when JPEG/WebP would work
• Missing loading="lazy" on below-fold images
• Hero/banner images larger than 1920px wide
• Product images not using Shopify CDN responsive sizing

Fixes:

✓ Use Shopify's built-in image_url filter with size parameters:
  {{ image | image_url: width: 800 }}

✓ Add loading="lazy" to all images below the fold
✓ Use WebP format (Shopify CDN converts automatically with format: 'webp')
✓ Resize hero images to max 1920x800px before upload
✓ Use srcset for responsive images — serve 400px on mobile, 800px on tablet, 1200px on desktop

# 4. Third-Party Scripts

External scripts — analytics, pixels, chat widgets, A/B testing tools — run on your visitors' browsers. Each one adds latency.

Common third-party script impact:

Google Analytics (GA4)     ~45 KB   — Keep, but use gtag.js not analytics.js
Facebook Pixel             ~60 KB   — Keep, defer loading
Google Tag Manager         ~80 KB   — Keep, but audit what it loads
Hotjar                     ~100 KB  — Remove if not actively reviewing recordings
Chat widgets (Intercom)    ~300 KB  — Load on click, not page load
A/B testing (Optimizely)   ~200 KB  — Remove if not running active experiments

Fixes:

✓ Defer non-critical scripts: load after page interaction
✓ Remove scripts for tools you are not actively using
✓ Use server-side tracking for analytics where possible
✓ Load chat widgets on user interaction:

<!-- Load chat only when user clicks the chat button -->
<button id="chat-trigger">Chat with us</button>
<script>
document.getElementById('chat-trigger').addEventListener('click', function() {
  // Load chat widget script dynamically
  var s = document.createElement('script');
  s.src = 'https://chat-provider.com/widget.js';
  document.head.appendChild(s);
}, { once: true });
</script>

# 5. Liquid Template Optimization

Shopify renders pages server-side using Liquid. Inefficient Liquid code slows down TTFB (Time to First Byte).

Check for:

• Nested for loops — especially product loops inside collection loops
• include vs render — include creates a new scope and is slower. render is faster and should be preferred
• Unused filters and calculations
• Heavy metafield lookups in loops

Fixes:

✓ Replace {% include %} with {% render %} everywhere
✓ Move expensive calculations outside loops
✓ Use {% unless %} to skip unnecessary rendering
✓ Paginate collections — never loop over all products
✓ Cache expensive operations using Liquid variables

# 6. CSS and JavaScript Delivery

Check for:

• Render-blocking CSS files
• Unused CSS (common with themes that include styles for all sections)
• JavaScript loaded synchronously in <head>
• Inline critical CSS not implemented

Fixes:

✓ Defer non-critical JavaScript: <script defer src="...">
✓ Preload critical resources: <link rel="preload" href="..." as="style">
✓ Remove unused CSS (use Chrome DevTools Coverage tab to identify)
✓ Minify custom CSS and JavaScript
✓ Use Shopify's asset_url and stylesheet_tag for cache-friendly delivery

# The Fix Priority Matrix

Not all fixes have equal impact. Prioritise by effort vs improvement:

# Real Improvements

These are the kinds of improvements you can expect when working through this checklist systematically:

The two biggest wins in this example: removing 6 unused apps (cut 3 MB of JavaScript) and optimizing 12 product images from PNG to WebP with responsive sizing.

# After the Fix: Monitoring

Performance is not a one-time fix. Apps get added, images get uploaded, themes get updated. Set up monitoring:

✓ Monthly PageSpeed check on key pages (home, collection, product)
✓ Set up Core Web Vitals monitoring in Google Search Console
✓ Review app list quarterly — remove anything not actively used
✓ Check image sizes whenever new products are added

# Next Steps

This checklist covers the most common performance issues. Every store is different — the specific fixes depend on your theme, apps, and traffic patterns.

If your store scores below 50 on mobile PageSpeed, there are likely quick wins that can significantly improve both speed and conversion rate. For stores already in the 50–80 range, the improvements are more targeted but still measurable.

For a deeper look at how ecommerce performance connects to revenue, see How to Improve Ecommerce Conversion Using Data and Automation.

Need a performance audit for your specific store? Ecommerce optimization services can identify exactly what is slowing your site down and fix it.

Get in touch to discuss your store's performance.