A Shopify theme averages a Lighthouse Performance score of 35–55 on mobile. A well-built Next.js storefront on Medusa hits 90–97. That’s not a marginal difference — it’s a different class of user experience. More importantly, it translates directly into conversion rates and Google Ads Quality Scores, both of which affect how much you’re paying to acquire customers. Here’s what the performance gap actually means in financial terms.
Why Headless Architecture Changes Performance
A traditional ecommerce store — Shopify, WooCommerce with a page builder, Magento — loads a complete server-rendered page on every navigation. JavaScript frameworks, theme CSS, and tracking scripts all load together. The storefront and the commerce backend are coupled: your page speed is limited by how efficiently the platform renders its own templates.
Medusa’s headless architecture separates the frontend from the backend. The storefront (typically Next.js) is a completely independent application that fetches data from the Medusa API. This separation allows the storefront to be built and optimized like a performance-first web application — not like a theme sitting on top of a commerce engine.
The key performance techniques that become available in a headless architecture:
- Static generation (SSG) — product pages, category pages, and content pages are pre-rendered at build time and served from a CDN edge node. There is no server-side rendering delay on the critical path.
- Incremental static regeneration (ISR) — pages can be revalidated in the background as inventory or pricing changes, without requiring a full rebuild.
- Server components — React 18 server components allow data fetching at the component level without blocking the initial render.
- Edge caching — because the frontend is decoupled from the backend, full page caching at the CDN layer is straightforward. A Shopify theme can’t be fully edge-cached because it’s dynamic by default.
These aren’t abstract technical advantages. They produce measurable page load times.
Actual Performance Numbers: Headless vs. Traditional
The numbers below reflect benchmarks from real stores, not synthetic tests.
Shopify themes (standard, non-headless):
- Mobile Lighthouse Performance: 35–55 (median approximately 45)
- LCP (Largest Contentful Paint): 4.2–7.8 seconds on mobile
- TBT (Total Blocking Time): 400–900ms
- CLS (Cumulative Layout Shift): 0.08–0.25
WooCommerce with Elementor or Divi:
- Mobile Lighthouse Performance: 22–42 (median approximately 32)
- LCP: 5.5–9.0 seconds on mobile
- TBT: 600–1,400ms
- CLS: 0.10–0.35
Medusa.js with Next.js storefront (well-built):
- Mobile Lighthouse Performance: 88–97
- LCP: 1.2–2.4 seconds on mobile
- TBT: 50–150ms
- CLS: 0.00–0.03
The LCP difference is the most commercially significant. Google’s threshold for “good” LCP is under 2.5 seconds. The median Shopify theme fails this threshold on mobile. The median Medusa Next.js storefront meets it.
For a deeper explanation of why headless architecture produces these results, our headless commerce explained post covers the rendering pipeline differences.
What Performance Actually Costs You in Conversions
The conversion rate impact of page speed is well-documented at this point. Google’s own research found that a 1-second delay in mobile load time reduces conversions by 20%. Portent’s 2019 B2C study found that sites loading in 1 second converted at 2.5x the rate of sites loading in 5 seconds.
Let’s put numbers on it.
A typical Shopify store with a mobile Lighthouse score of 45 might see a mobile conversion rate of 1.2%. The same store rebuilt as a headless Medusa storefront with a mobile Lighthouse score of 93 would realistically see mobile conversion rates of 2.0%–2.8%, depending on the product and checkout experience.
At $100,000/month in mobile GMV and a baseline 1.2% conversion rate:
- At 1.2% conversion: 100,000 sessions × 0.012 = 1,200 conversions at $83.33 average order value
- At 2.0% conversion: same 100,000 sessions × 0.02 = 2,000 conversions at $83.33 AOV = $66,640 additional monthly revenue
That’s $800,000 in additional annual revenue from the same traffic, purely from conversion rate improvement attributable to performance.
These aren’t guaranteed numbers — conversion rate depends on many factors beyond speed. But the direction and rough magnitude are supported by the research. Performance is one of the highest-leverage improvements an ecommerce business can make.
Google Ads Quality Score and Cost Per Click
Page speed affects Google Ads Quality Score directly. Google’s Quality Score is calculated from three components: expected clickthrough rate, ad relevance, and landing page experience. Landing page experience is explicitly influenced by page load speed and mobile usability.
A Quality Score of 10 vs. 5 means approximately 50% lower cost per click for the same ad position. That’s not a marginal effect. It means a slow landing page is a direct tax on every dollar you spend in Google Ads.
Specifically:
- A Quality Score of 7–10: CPC discount of 20%–50% below the average auction price
- A Quality Score of 4–6: CPC at approximately market rate
- A Quality Score of 1–3: CPC premium of 25%–400% above market rate
A Shopify theme with 4.5-second LCP is likely landing at a 5–6 Quality Score on the landing page experience component. A headless storefront with 1.8-second LCP is landing at 8–10.
If your current Google Ads spend is $20,000/month and you’re paying an inflated CPC because of poor landing page speed, optimizing to a top-tier Quality Score can reduce your effective CPC by 30%–40%. That’s $6,000–$8,000/month in ad savings — $72,000–$96,000/year — without changing your bids or targeting.
Core Web Vitals as a Ranking Signal
Google confirmed Core Web Vitals as a ranking factor through its Page Experience update in 2021. The signal weight is debated — Google has acknowledged it’s not the dominant ranking factor. But for competitive commercial queries where multiple pages are close in authority and relevance, Core Web Vitals can be the deciding factor.
The three Core Web Vitals are LCP, FID/INP (Interaction to Next Paint, replacing First Input Delay), and CLS. The passing thresholds:
- LCP: under 2.5 seconds
- INP: under 200ms
- CLS: under 0.1
A standard Shopify theme fails LCP on mobile in most third-party audits. A headless Medusa storefront passes all three with a proper build.
For ecommerce sites targeting competitive product keywords — where page 1 includes established players with strong domain authority — passing Core Web Vitals while your competitors fail can be a meaningful ranking edge.
What Shopify Does Well on Performance
Shopify’s infrastructure is genuinely strong. Their CDN delivery, server response times, and TTFB (Time to First Byte) are excellent — Shopify’s servers are fast. The performance problem with Shopify themes is mostly client-side: the JavaScript weight of theme code, apps, and tracking pixels that loads in the browser.
Shopify’s hydrogen framework (their first-party headless solution using Remix) is a legitimate attempt to solve the client-side performance problem. A well-built Hydrogen store can achieve similar Lighthouse scores to a Medusa Next.js storefront. The difference is that Hydrogen locks you into Shopify’s commerce backend — you’re still paying the Plus fees and living within Shopify’s API constraints.
For a direct comparison of Medusa against Shopify across cost and features, see our Medusa.js vs Shopify Plus breakdown.
Real-World Medusa Performance Benchmarks
What does a production Medusa Next.js storefront actually score?
A properly built Medusa storefront with:
- Static generation for product and category pages
- Image optimization through Next.js Image component (WebP, responsive sizes, lazy loading)
- Font optimization (font-display: swap, preloading)
- Third-party script deferral (analytics, chat loaded async after interaction)
- CSS critical path extraction
- Edge caching via Cloudflare
…consistently hits:
- Mobile Lighthouse: 92–97
- Desktop Lighthouse: 96–99
- LCP (mobile): 1.1–2.0 seconds
- INP: 60–120ms
- CLS: 0.00–0.02
Hitting these scores requires active optimization decisions, not just “using Next.js.” A headless storefront built without attention to image loading, JavaScript weight, and caching strategy can still underperform. The architecture creates the potential — the implementation delivers the score.
For a broader look at how Medusa’s architecture enables this level of performance, our Medusa.js architecture explained post covers the system design in detail.
The Build Cost vs. Performance Gain Calculation
A full headless Medusa storefront migration costs $40,000–$120,000 depending on complexity. Is the performance improvement worth it?
At $500,000/month GMV with a 15% mobile share and a current 1.2% mobile conversion rate:
- Current mobile revenue: $75,000/month
- At 2.0% mobile conversion: $125,000/month
- Additional monthly revenue: $50,000
- Payback period on a $60,000 build: 1.2 months
This is not guaranteed — conversion rate improvements depend on more than speed. But when the calculation looks like this, the question isn’t whether to improve performance. It’s whether the headless migration is the right vehicle, or whether a more targeted optimization on the existing platform would deliver most of the gain at lower cost.
An intermediate option: a headless frontend on Shopify (Hydrogen) or a heavily optimized WooCommerce theme with no page builder. These can reach Lighthouse scores of 70–85 at lower cost than a full Medusa migration. Not as high as a purpose-built Medusa storefront, but significantly better than a standard theme.
For businesses where WooCommerce is the right platform, our WooCommerce development work includes performance-first builds without page builders — Lighthouse scores in the 75–90 range are achievable on WooCommerce with the right approach.
FAQ
What Lighthouse score does a typical Shopify theme achieve? Most Shopify themes score 35–55 on mobile Lighthouse Performance. The exact score depends on the theme, the number of installed apps (each adds JavaScript weight), and how many tracking pixels are loaded. High-app stores (8+ apps) regularly score below 30. Shopify’s own theme benchmarks show similar ranges.
Can Shopify achieve high Lighthouse scores without going headless? Yes, but it requires significant effort. A Shopify store with a minimal app footprint, optimized theme code, and careful script management can reach 65–80 on mobile Lighthouse. Shopify’s Hydrogen framework (headless on Shopify) can hit 90+. The baseline Shopify theme experience is poor; the ceiling is reasonable with deliberate optimization.
Does page speed directly affect my Google Ads cost? Yes. Landing page experience is one of three components of Google Ads Quality Score, and page speed is a direct input to landing page experience. A higher Quality Score reduces your cost-per-click for the same ad position. The relationship is meaningful — moving from a Quality Score of 5 to 8 can reduce CPC by 30%–50%.
How much does Core Web Vitals affect search rankings? Google has confirmed Core Web Vitals as a ranking signal but has also stated it’s a tiebreaker rather than a primary ranking factor. For commercial queries where competing pages are close in authority and content quality, passing Core Web Vitals (LCP under 2.5s, INP under 200ms, CLS under 0.1) can be the differentiator. For queries where you’re significantly outranked by domain authority, fixing Core Web Vitals won’t close the gap by itself.
What’s the LCP of a typical Medusa Next.js storefront? A well-optimized Medusa Next.js storefront with static generation and CDN edge caching achieves LCP of 1.1–2.0 seconds on mobile. This consistently passes Google’s “good” threshold of under 2.5 seconds. The specific number depends on image optimization, geographic CDN coverage, and whether product pages are statically generated or server-side rendered.
Does WooCommerce perform as well as Medusa on Lighthouse? No, but hand-coded WooCommerce without a page builder performs significantly better than Elementor or Divi builds. A custom WooCommerce theme, properly coded, can achieve mobile Lighthouse scores of 75–90. A Medusa Next.js storefront typically reaches 90–97. Both significantly outperform standard Shopify themes. The right choice depends on your total requirements — not just performance.
What’s the realistic conversion rate improvement from going headless? There’s no universal number. Improvements in mobile conversion rate from improving LCP from 6 seconds to 1.5 seconds typically range from 15%–40% in A/B tests we’ve seen reported, with some outliers higher. The improvement is most pronounced on mobile, where performance degradation is most severe, and for products with high purchase intent (where friction reduction matters most). Lower-intent browsing traffic shows smaller conversion rate differences.
If you want to understand what performance level your current store is achieving and what it’s costing you in conversions and ad spend, see our fixed-price packages for an assessment. For businesses where WooCommerce is the right base, our custom WooCommerce store builds deliver performance-first results without the headless complexity.