Headless Hydrogen vs Liquid: Which Is Right for Your Shopify Store?
Every week I speak to a merchant who’s been told by an agency that they need to go headless. Sometimes that’s true. Often it isn’t. Making the wrong call here costs tens of thousands in development time and ongoing maintenance — so let’s look at this clearly.
What “Headless” Actually Means
A traditional Shopify store renders pages on Shopify’s servers using Liquid templates. The storefront and the commerce engine are tightly coupled. Headless decouples them: your frontend is a separate application (built with React, Next.js, Astro, or Shopify’s own Hydrogen framework) that fetches data from Shopify’s Storefront API.
Hydrogen is Shopify’s official React-based framework for building headless storefronts. It’s built on Remix, includes streaming SSR, and is designed to deploy on Shopify’s Oxygen infrastructure.
The Case for Liquid (Traditional Themes)
Liquid is the right choice for most stores, especially those under $5M annual revenue. Here’s why:
- Lower cost: A polished Liquid theme with custom sections costs a fraction of a headless build
- Shopify compatibility: Every app integrates out of the box — reviews, loyalty, subscriptions, search — with no custom API work
- Faster to launch: You can go from brief to live in weeks, not months
- Easier to maintain: Your team can make content changes without touching React
The Online Store 2.0 architecture — with JSON templates, app blocks, and the Section Rendering API — has dramatically closed the gap with headless in terms of performance and flexibility.
The Case for Hydrogen (Headless)
Hydrogen makes sense when you have specific requirements that Liquid can’t satisfy:
- Custom buying experiences: configurators, 3D product viewers, heavily interactive PDPs that feel like native apps
- Multi-region, multi-language complexity: managing multiple storefronts with a single frontend codebase
- Performance at scale: when you need sub-second LCP globally and the Shopify CDN alone isn’t cutting it
- Omnichannel: the same data layer powering your web store, mobile app, kiosk, and retail POS
Key Trade-offs to Understand
| Liquid | Hydrogen | |
|---|---|---|
| App compatibility | Native | Custom integration per app |
| Build cost | Low–medium | High |
| Time to market | Fast | Slow |
| Performance ceiling | Good | Excellent |
| Team expertise required | Liquid/HTML/CSS | React, TypeScript, Remix |
| Ongoing maintenance | Low | High |
My Honest Recommendation
For brands doing under $2M/year: stay on Liquid, invest in a great theme and performance optimisation. For brands doing $5M+ with complex, bespoke requirements and a dedicated dev team: Hydrogen is worth evaluating seriously.
The middle ground — $2M–$5M — is where the decision gets nuanced. It often comes down to how differentiated the buying experience needs to be. If your product is complex and your store is a core part of your brand experience, headless pays off. If you’re primarily selling through strong marketing and the store is a conversion tool, Liquid is almost always the better ROI.
Not sure which approach is right for your store? Book a free discovery call and we’ll map out the right architecture for your goals and budget.
Ready to work together?
Get in touch →