Your Shopify store is slow. And it's costing you money.
Here's the reality:
- Every 1 second of load time costs you 7% in conversions
- 53% of mobile users abandon sites that take more than 3 seconds to load
- Google ranks faster sites higher (Core Web Vitals are a ranking factor)
I've optimized hundreds of Shopify stores. Most go from "painfully slow" to "fast" with the same 15-20 fixes. This guide covers everything I do, step by step.
First: Check Your Current Speed
Before optimizing, you need to know where you stand.
Tools to Measure Shopify Speed
1. Google PageSpeed Insights (Free) pagespeed.web.dev
- Most comprehensive
- Shows Core Web Vitals
- Gives specific recommendations
- Test mobile AND desktop separately
2. Shopify's Online Store Speed Report
- Found in: Analytics > Reports > Online Store Speed
- Shopify's own measurement
- Compares you to similar stores
- Not as detailed as PageSpeed
3. GTmetrix (Free) gtmetrix.com
- Waterfall chart shows what's loading
- Great for finding specific bottlenecks
- Test from different locations
What's a Good Shopify Speed Score?
| Score | Rating | What It Means |
|---|---|---|
| 90-100 | Excellent | Top 5% of Shopify stores |
| 70-89 | Good | Better than average |
| 50-69 | Needs Improvement | Typical Shopify store |
| 0-49 | Poor | Significant problems |
Reality check: Most Shopify stores score 40-60 on mobile. Getting above 70 puts you ahead of competitors.
Part 1: Quick Wins (30 Minutes)
These fixes take minimal effort but make noticeable impact.
1. Remove Unused Apps
This is the biggest speed killer for most stores.
Every Shopify app adds:
- JavaScript files (slows page load)
- CSS files (slows rendering)
- External requests (adds latency)
- Often code that runs even when not needed
How to audit:
- Go to Settings > Apps and sales channels
- List every installed app
- For each one, ask: "Did this generate revenue in the last 30 days?"
- If no, uninstall it
The harsh truth: Most stores have 5-10 apps they're not using. Each one is slowing you down.
After uninstalling: Some apps leave code behind. Check your theme for leftover snippets (Customize > Theme actions > Edit code > Snippets).
2. Replace Heavy Apps with Lightweight Alternatives
Some app categories are notorious for slow performance:
Product Reviews:
- Slow: Yotpo, Loox (lots of external calls)
- Faster: Judge.me, Shopify's native reviews
Popups:
- Slow: Privy, OptiMonk (heavy scripts)
- Faster: Native Shopify popups, lightweight custom solutions
Chat Widgets:
- Slow: Intercom, Drift (massive scripts)
- Faster: Tidio (lighter), or defer loading
Analytics:
- Slow: Multiple tracking scripts
- Faster: Consolidate to Google Analytics 4 + Facebook Pixel only
3. Enable Lazy Loading for Images
Lazy loading means images only load when they enter the viewport (instead of all at once on page load).
For Shopify 2.0 themes (Dawn, etc.): Most have lazy loading built in. Check:
- Theme settings > General > Enable lazy loading
- Or it's automatic with
loading="lazy"on image tags
For older themes:
Add loading="lazy" attribute to image tags or install a lightweight lazy loading app (Hyperspeed, Booster are popular).
Impact: Can reduce initial page load by 40-60% on image-heavy pages.
4. Compress Your Product Images
Large images are the #1 cause of slow Shopify pages.
Quick rules:
- Product images: Max 2000x2000 pixels
- Hero/banner images: Max 1920x1080 pixels
- File size: Under 200KB per image (ideally under 100KB)
Free tools:
- TinyPNG - Drag and drop compression
- Squoosh - Google's advanced compressor
- ImageOptim (Mac) - Batch compression
Shopify apps:
- TinyIMG (auto-compresses on upload)
- Crush.pics (bulk optimization)
Pro tip: Use WebP format when possible. It's 25-30% smaller than JPEG/PNG with equal quality. Most Shopify themes now serve WebP automatically.
5. Use a System Font Stack
Custom fonts (Google Fonts, Adobe Fonts) add 100-500KB to page load.
The problem:
<!-- This adds ~400ms to page load -->
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap">
The solution: Use system fonts that are already on users' devices:
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
If you must use custom fonts:
- Self-host them (don't use Google Fonts CDN)
- Subset to only characters you need
- Use
font-display: swapto prevent invisible text - Limit to 2 font weights maximum
Part 2: Theme Optimization (1-2 Hours)
6. Switch to a Faster Theme
Not all Shopify themes are equal. Some are bloated with features you'll never use.
Fastest free themes:
- Dawn - Shopify's official theme, extremely fast
- Refresh - Clean, minimal
- Sense - Well-optimized
Fast premium themes:
- Prestige - Good balance of features and speed
- Impulse - Fast with good customization
- Symmetry - Consistently good performance
Themes to avoid (generally slow):
- Themes with 100+ features
- Themes with built-in mega-menus and complex animations
- Old themes (pre-Shopify 2.0)
How to test before switching: Visit the theme's demo store and run it through PageSpeed Insights.
7. Minimize Theme Sections
Every section in your theme adds code, even if hidden.
Common bloat:
- Homepage sections you're not using
- Built-in features like blogs, testimonials, Instagram feeds
- Duplicate navigation elements
What to do:
- Go to Customize
- Remove sections you don't need (don't just hide them)
- Simplify complex sections (fewer elements = faster load)
The homepage trap: Many stores load 15+ sections on their homepage. Most visitors scroll through 3-4. Remove the rest.
8. Optimize Collection Pages
Collection pages are often the slowest because they load many products.
Quick fixes:
Reduce products per page:
- Default: 24-48 products
- Faster: 12-16 products per page
- Add pagination or "Load More" button
Simplify product cards:
- Show 1 image, not hover swap images
- Remove quick-buy buttons (or load them on hover)
- Minimize badge/label displays
Disable filters you don't need:
- Each filter option adds to page weight
- Only show filters customers actually use
9. Simplify Product Pages
Product pages have the most room for optimization.
What to review:
- Image gallery: Max 5-6 images, not 20
- Related products: Show 4, not 12
- Product tabs: Combine content, reduce tabs
- Social share buttons: Remove or defer load
- Trust badges: Use CSS/SVG, not images
- Size charts: Load on click, not on page load
JavaScript on product pages: Many apps add JavaScript to product pages:
- Review widgets
- Upsell/cross-sell popups
- Countdown timers
- Stock counters
Each one adds 100-500ms. Be ruthless about what stays.
10. Defer Non-Critical JavaScript
Some JavaScript needs to run immediately. Most doesn't.
Critical (load first):
- Add to cart functionality
- Core navigation
- Critical styling
Non-critical (can load later):
- Chat widgets
- Review widgets
- Analytics (after page content loads)
- Social media embeds
How to defer:
Add defer or async attribute to script tags:
<!-- Load after HTML parsing -->
<script src="chat-widget.js" defer></script>
<!-- Load in parallel, execute when ready -->
<script src="analytics.js" async></script>
Most apps don't let you modify this. But some have "lazy load" options in settings.
Part 3: Technical Optimization (2-4 Hours)
These require some technical knowledge or a developer.
11. Preload Critical Resources
Tell browsers to start loading important resources early.
Add to theme.liquid <head>:
<!-- Preload main stylesheet -->
<link rel="preload" href="{{ 'theme.css' | asset_url }}" as="style">
<!-- Preload hero image -->
<link rel="preload" href="{{ section.settings.hero_image | image_url: width: 1200 }}" as="image">
<!-- Preload critical font -->
<link rel="preload" href="{{ 'custom-font.woff2' | asset_url }}" as="font" type="font/woff2" crossorigin>
Don't preload everything. Only resources needed for above-the-fold content.
12. Implement Critical CSS
Critical CSS means inlining the CSS needed for above-the-fold content, so it loads instantly.
The problem: External stylesheets block rendering. The page waits for CSS to load before showing content.
The solution:
- Extract CSS for above-the-fold content
- Inline it in the
<head> - Load the full stylesheet asynchronously
Tools:
- Critical - Node.js tool
- Manually extract with browser DevTools
Shopify apps: Some speed optimization apps do this automatically (Hyperspeed, SpeedBoostr).
13. Optimize Third-Party Scripts
Third-party scripts (tracking, widgets, pixels) often contribute 50%+ of load time.
Audit your scripts:
- Run GTmetrix waterfall analysis
- Look for external domains
- Note load time for each
Common offenders:
- Facebook Pixel: 200-400ms
- Google Analytics: 100-200ms
- Hotjar/Clarity: 300-500ms
- Chat widgets: 200-500ms
- Review widgets: 300-600ms
Solutions:
Use Google Tag Manager for better control:
- Load scripts conditionally
- Delay non-essential scripts
- Single container instead of multiple scripts
Delay non-critical scripts:
// Load Facebook Pixel after 3 seconds
setTimeout(function() {
// Facebook Pixel code here
}, 3000);
Consider removing: Do you actually use Hotjar data? Does that social proof widget generate sales? If not, remove it.
14. Enable Browser Caching
Shopify handles most caching automatically, but check:
Theme assets: Shopify CDN caches these with proper headers. No action needed.
Images: Same as above, properly cached.
Third-party resources: You can't control these. But if they don't cache well, that's another reason to remove or replace them.
Note: Shopify's speed report may show "Leverage browser caching" warnings for Google/Facebook scripts. You can't fix these (they're controlled by Google/Facebook). Ignore them.
15. Optimize Shopify Fonts
If your theme uses Shopify's font picker, the fonts load from Shopify's CDN.
Better approach:
- Download the font files
- Upload to your theme assets
- Reference them locally
This gives you control over:
- Which font weights load
- Using
font-display: swap - Preloading the font
Example in theme CSS:
@font-face {
font-family: 'Your Font';
src: url('{{ "your-font.woff2" | asset_url }}') format('woff2');
font-display: swap;
font-weight: 400;
}
Part 4: Advanced Optimization
For stores that need every millisecond.
16. Use Shopify CDN Effectively
Shopify's CDN is fast, but you can help it:
For images: Use Shopify's image transformation API:
{{ product.featured_image | image_url: width: 400 }}
This generates optimized images at the exact size needed.
For scripts and styles:
Reference assets using | asset_url filter to use Shopify CDN.
17. Implement Predictive Prefetching
Prefetch resources for pages users are likely to visit next.
<!-- When on collection, prefetch likely product page -->
<link rel="prefetch" href="{{ product.url }}">
<!-- Prefetch cart page when user adds to cart -->
<link rel="prefetch" href="/cart">
Use sparingly. Prefetching everything wastes bandwidth.
18. Consider a Headless Approach
For maximum speed, consider headless commerce:
What it is: Your frontend is built with React/Vue/Svelte instead of Liquid. Shopify handles the backend only.
Benefits:
- Full control over performance
- Modern framework optimizations
- Can achieve 90+ PageSpeed scores easily
Downsides:
- Expensive to build ($20,000+)
- Loses Shopify theme ecosystem
- Requires ongoing development
Best for: Large stores ($1M+) where conversion rate improvements justify development cost.
Options:
- Shopify Hydrogen (Shopify's official framework)
- Next.js Commerce
- Custom builds with Storefront API
Common Speed Myths (Debunked)
"Shopify is just slow"
Not true. I've achieved 85+ PageSpeed scores on Shopify. The platform isn't the bottleneck; your implementation is.
"I need a speed app"
Speed optimization apps can help, but they're not magic. They automate some fixes covered in this guide. If you can do it yourself (or hire a developer once), you'll get the same results without ongoing app fees.
"My score is fine because it works on my computer"
You have fast internet and a powerful device. Your customers might be on slow 4G with older phones. Always test on mobile, simulated slow connections.
"Google PageSpeed score doesn't matter"
Core Web Vitals are a Google ranking factor. Beyond SEO, slow pages demonstrably hurt conversion rates. The score is a useful benchmark.
"I'll optimize later when I'm bigger"
Speed affects conversion rate from day one. A 10% improvement in speed can mean 10% more sales. The sooner you optimize, the more it compounds.
Speed Optimization Checklist
Here's everything in a checklist format:
Quick Wins:
- Remove unused apps
- Replace heavy apps with lighter alternatives
- Enable lazy loading for images
- Compress product images (under 100KB each)
- Consider system fonts instead of custom fonts
Theme Optimization:
- Use a fast theme (Dawn, Prestige, Impulse)
- Remove unused theme sections
- Reduce products per collection page
- Simplify product page elements
- Defer non-critical JavaScript
Technical:
- Preload critical resources
- Implement critical CSS
- Audit and optimize third-party scripts
- Use Google Tag Manager for script management
- Optimize font loading
Testing:
- Test on PageSpeed Insights (mobile!)
- Test on GTmetrix with waterfall analysis
- Test on real mobile device
- Test with slow connection simulation
What We Offer
If you'd rather have experts handle this, we offer Shopify speed optimization services.
What we do:
- Comprehensive speed audit
- Implementation of all optimizations
- Before/after documentation
- Ongoing monitoring
Typical results:
- 30-50% improvement in load time
- 15-25 point increase in PageSpeed score
- Improved Core Web Vitals across the board
Starting at: $999 for full optimization
Frequently Asked Questions
What's a good target for Shopify speed score?
Aim for 70+ on mobile PageSpeed. 90+ is excellent but difficult for feature-rich stores.
Why is my mobile score so much lower than desktop?
Mobile tests simulate slower connections and devices. It's normal for mobile to be 20-30 points lower. Prioritize mobile optimization.
Will speed optimization break anything?
Proper optimization shouldn't break functionality. Always test thoroughly after changes. Work with backups if making major changes.
How often should I audit speed?
Quarterly, or whenever you add new apps/features. Speed tends to degrade over time as stores add functionality.
Do CDN services help Shopify speed?
Shopify already uses a fast CDN. Additional CDNs don't help much. Focus on optimization instead.
Should I use AMP for Shopify?
AMP is mostly deprecated and doesn't provide significant benefits for e-commerce. Focus on regular page optimization instead.
Final Thoughts
A fast Shopify store isn't a luxury. It's a competitive advantage.
Every second you shave off load time:
- Improves conversion rates
- Reduces bounce rates
- Helps SEO rankings
- Creates better customer experience
The fixes in this guide took me years to learn through trial and error. You can implement most of them in a weekend.
Start with the quick wins. Measure the impact. Then tackle the technical stuff if needed.
Your future customers (and your revenue) will thank you.
Want expert help?
We've optimized hundreds of Shopify stores. Get a free speed audit to see exactly what's slowing you down.
Last updated: January 2026
All techniques tested on real Shopify stores. Results vary based on theme, apps, and current optimization state.
