A few weeks ago, a furniture retailer from Wuppertal called me in desperation. "Our Pagespeed score is 23. On mobile. Google says it's catastrophic." He was right. His store took 7.8 seconds on an average 4G connection before the first image was even visible. He'd invested roughly €18,000 in marketing over the past two years — and was losing visitors in droves because half of them bounced before the page finished loading.
Three weeks later, his mobile score was 71, desktop 94. Load time under 2 seconds. Conversion rose 31% within a month. What did we do? No magic. We methodically identified every performance bottleneck and removed them in the right order. That's exactly what I'll show you in this article.
Why Shopify speed matters (short and painful)
Here are the numbers Google itself provides:
- Load time going from 1 to 3 seconds increases bounce rate by 32%
- From 1 to 5 seconds: bounce rate +90%
- From 1 to 6 seconds: +106%
- From 1 to 10 seconds: +123%
On the conversion side:
- 1 extra second of load time = 7% less conversion (Akamai study)
- Amazon calculated: 100ms delay = 1% revenue loss
- Walmart: every second of improvement = 2% more conversions
Shopify itself showed in 2022: stores with Pagespeed above 70 convert on average 28% better than stores below 40. In fashion, even 45% better.
Put differently: if your store is slow, you're literally leaving money on the table — every single day.
How to measure your current speed
Before optimizing anything, you need to measure. Three tools I use daily:
Google PageSpeed Insights
The official tool. Go to pagespeed.web.dev, enter your URL. Look at two values:
- Mobile Score (the important one — 60% of your traffic is mobile)
- Desktop Score (typically 20-30 points higher)
Target: Mobile above 70, Desktop above 90. Achievable, but not trivial.
Shopify's built-in Speed Report
Shopify Admin → Analytics → Reports → "Online store speed." This score is Shopify's own assessment. 50+ is acceptable, 70+ good, 80+ excellent.
WebPageTest.org
The pro tool. Shows you exactly which element loads when and where the bottleneck is. More complex to read, but unbeatable for deep analysis.
47 optimizations, sorted by impact
I've compiled this list over five years of Shopify audits. Sorted by impact per effort. If you only implement the first 10, you'll capture 70-80% of the possible improvement.
TIER 1 — Immediate actions with biggest impact
1. Compress images and convert to WebP. This is number one. 60-70% of load time is images. Shopify has been automatically converting to WebP since 2022, but many stores still have old JPGs/PNGs. Tools like tinypng.com or apps like Crush.pics can optimize hundreds of images in an hour.
Real impact: With the furniture retailer: 4.8s load time reduced to 2.9s, purely through image optimization.
2. Enable lazy loading for below-the-fold images. Dawn and all modern themes do this automatically. But check: does your theme code have loading="lazy" on img tags?
3. Remove unused apps. Every app loads code into your frontend. Apps you installed two years ago and never touched again still kill your performance. Shopify Admin → Apps → go through them, delete ruthlessly.
Real impact: In one audit we deleted 17 of 32 apps. Pagespeed score: 41 → 67.
4. Optimize your hero image (LCP). The Largest Contentful Paint is usually your hero image. If it's 800 KB, the whole page suffers. Target: under 200 KB, WebP format, exact resolution.
5. Check if your theme is on a modern foundation. Pre-2021 themes are often heavyweight. Dawn (Shopify's own), Origin, Studio, Sense — these are performance-oriented. If you have an old premium theme (Avone, Booster, Wokiee), switching is often the only solution.
TIER 2 — High impact, medium effort
6. Reduce custom fonts. Each additional font costs 100-300 KB. Maximum two fonts (heading + body), maximum 2-3 weights.
7. Host Google Fonts locally or use Shopify's font loader. Instead of loading from Google directly (extra DNS lookup), use Shopify's font system. Saves 200-400ms.
8. Preload critical resources. In theme.liquid in the <head>: add preload for your hero image. The browser starts loading before it even knows it needs it.
9. Check apps for "Asset Loading." Some apps load their code on EVERY page even though they're only needed on the product page. Make app blocks conditional in theme code.
10. Reduce tracking pixels. Facebook, Google Analytics, TikTok, Pinterest, Klaviyo — each pixel costs performance. Do you really need all of them? Audit: which pixels haven't been evaluated in 6 months? Remove them.
TIER 3 — Medium impact, high detail
11-15. CSS minification, JavaScript defer/async, loading third-party scripts after cookie consent, critical CSS inline, SVG sprites for icons.
16-20. CDN cache verification, section splitting for long homepages (max 6-8 sections), reducing heavy animations on mobile, replacing video hero with image on mobile, preloading slideshow images.
TIER 4 — Technical detail optimizations
21-30. Theme settings audit, Liquid loop optimization, efficient metafield usage, pagination over infinite scroll, variant switching optimization, quick-view app check, wishlist performance check, limiting recently viewed products (4-6 is enough), search suggestion throttling, lazy loading reviews.
TIER 5 — Advanced optimizations
31-40. Resource hints (preconnect, dns-prefetch), CLS to zero (always set image dimensions), FID optimization (code splitting), server-side rendering checks, AVIF format testing, Brotli compression, theme JS module splitting, inline SVG, CSS framework bloat elimination, simplifying heavy forms.
TIER 6 — Headless / Hydrogen level
41-45. Hydrogen / Headless architecture (if you truly need Pagespeed 95+), edge caching, static site generation, ISR, Next.js / Remix alternatives.
TIER 7 — Monitoring and maintenance
46. Set up Real User Monitoring. Tools like SpeedCurve or Calibre measure actual user experiences, not just lab data.
47. Performance audit every 6 months. Apps get installed, theme updates change code. What's fast today may be slow in 6 months.
What we typically do in speed audits
Days 1-2: Diagnosis
Complete analysis with PageSpeed Insights, WebPageTest, Lighthouse. We identify the biggest performance killers and prioritize by impact/effort.
Days 3-7: Quick Wins
Compress images, delete unused apps, optimize hero. Typically recovers 20-30 Pagespeed points.
Days 8-14: Theme optimization
Code-level interventions: JavaScript splitting, CSS optimization, critical CSS inline, lazy loading everywhere.
Days 15-21: Apps and third parties
Which apps are necessary, which can go, which need reconfiguration? Tracking pixel audit.
Days 22-28: Fine tuning
Last-mile optimizations: resource hints, compression headers, CDN settings. The last 5-10 points are often the hardest.
Common questions
How much Pagespeed score do I actually need?
Mobile above 60 is acceptable, above 70 good, above 80 excellent. Below 50, you're definitely losing money. Above 90 is nice, but the effort for the last few points is usually not economical.
How long does optimization take?
Quick wins (images, apps, hero): 1 week. Full optimization: 3-4 weeks. Headless migration: 3-6 months.
What does professional speed optimization cost?
Audit: $800-1,500. Full optimization: $3,500-8,000 depending on complexity. ROI typically within 3-6 months.
Is headless worth it for my store?
If you're under $1M in revenue: usually not. The effort exceeds the benefit. Over $1M with demanding UX: worth evaluating.
Does a premium theme make my store faster?
Often the opposite. Premium themes (Booster, Avone, Wokiee) are feature-rich but heavyweight. Dawn (free) is usually faster.
My takeaway
Speed optimization is 80% discipline and 20% wizardry. Most stores can dramatically improve performance with the first 10-15 optimizations without touching deep code.
If you're unsure where your store stands: run a free audit at pagespeed.web.dev. If your mobile score is below 60, stop leaving money on the table. Get in touch — first consultation is free.
