Headless Shopify: When the Engineering Cost Pays Off
Headless Shopify means decoupling the storefront from Shopify's rendering engine, typically by building a custom frontend in Next.js or a similar framework that calls the Storefront API. It is a legitimate architecture for the right store. It is also responsible for a meaningful number of expensive rewrites that did not need to happen.
What "headless" actually means in practice
A standard Shopify store uses Shopify's Liquid templating engine to render pages server-side. The theme controls what the customer sees. Shopify handles hosting, CDN, checkout, and payment processing.
A headless Shopify store replaces the Liquid theme with a custom frontend application — usually a JavaScript framework like Next.js — that fetches product data, collection data and cart state from Shopify's Storefront API. The checkout still runs on Shopify. Everything in between is code you own, deploy, and maintain.
The promise: complete control over the frontend experience, faster page loads, easier integration with external content sources, and the ability to run the same storefront on web, mobile app, and in-store terminals from one codebase.
The cost: you have left the platform's managed hosting and tooling behind. Every new Shopify feature — new checkout extensions, new app integrations, new theme editor blocks — requires engineering work to wire up. You are now running infrastructure.
The real cost breakdown
Before deciding on headless, account for:
- Initial build: a properly engineered headless storefront takes 3 to 4 months for a mid-complexity store. A Liquid theme rebuild takes 4 to 6 weeks.
- Hosting: you will need a hosting provider for the frontend application. Vercel, Netlify and AWS all work. Add the cost and the ops overhead.
- App compatibility: many Shopify apps inject scripts into the Liquid theme. In headless, you replicate their functionality in your own code or find API-based alternatives. Not every app has one.
- Maintenance: each Shopify platform update may require changes to your API integration. Liquid themes get this for free.
- Talent: Next.js or Remix developers are easier to hire than Shopify Liquid specialists in some markets, harder in others. Factor in your team's current skills.
Headless adds a platform layer that you own and maintain. That is a good trade only when what you get in return is worth more than what you give up.
When headless is worth it
There are genuine reasons to go headless. These are the ones that hold up in practice:
You are building an omnichannel experience
If your commerce experience needs to work identically across a web storefront, a mobile app, a kiosk, or a third-party marketplace, a single GraphQL layer over Shopify's Storefront API is a cleaner architecture than maintaining separate Liquid themes or mobile-specific codebases. This is the original case for headless and it remains valid.
Your content and commerce are deeply intertwined
If your brand runs editorial content — long-form articles, video, interactive features — alongside product pages, and that content needs to feel like one experience rather than two separate platforms, headless lets you manage everything through a single CMS like Contentful or Sanity while Shopify handles the commerce layer.
You have genuine performance requirements that Liquid cannot meet
A well-optimised Liquid theme can achieve very good Core Web Vitals. But if you need sub-second LCP at scale with a complex, highly personalised PDP — multiple pricing tiers, real-time inventory, dynamic recommendations — a React-based frontend with fine-grained control over rendering may genuinely outperform what Liquid can do.
The threshold matters. Most stores do not have performance requirements that a well-built Dawn-based theme cannot meet.
You are running multiple storefronts from one Shopify backend
If you have regional storefronts for different markets that share a product catalogue but need distinct localised experiences, a headless architecture with shared API access and market-specific frontends is cleaner than maintaining multiple themes with feature parity.
When headless is not worth it
Your conversion problem is not a frontend problem
We have audited stores where the headless rebuild was proposed as the solution to a low conversion rate. In most of those cases, the problem was checkout friction, analytics gaps, or poor merchandising — none of which require a new rendering architecture to fix. A headless rebuild that takes four months to complete while the conversion problem goes unfixed is an expensive detour.
Your team does not have the capability to maintain it
A headless storefront is a software product. It needs ongoing engineering attention: dependency updates, API changes, infrastructure monitoring, incident response. If your team is two people and your engineering capacity is two days a week, a headless build is a maintenance liability.
You are under ₹5 crore annual revenue
This is a rough heuristic, not a rule. But the overhead of a headless build — in time, cost, and ongoing engineering attention — is hard to justify for stores at early scale. The improvements available through Liquid theme optimisation, checkout extensions, and server-side rendering improvements are almost always a better use of the same budget at this stage.
The hybrid approach
There is a middle path that many teams overlook: Shopify's Online Store 2.0 themes with custom sections built in React using theme app extensions. This gives you modern frontend tooling for the components that need it, while keeping the rest of the store on Shopify's managed infrastructure.
This is not headless. But it handles a large category of cases where the real requirement is "we want better frontend engineering tooling on specific pages," which is different from "we need a fully decoupled architecture."
A decision framework
- Do you need the same storefront on three or more surfaces (web, app, kiosk)? Headless is likely the right call.
- Is your conversion problem a rendering problem, or is it checkout friction, analytics gaps, or bad merchandising? Fix those first.
- Can a well-built Liquid theme with custom sections and extensions meet your performance requirements? Test this before committing to a rebuild.
- Does your team have the capacity to maintain a custom frontend application alongside everything else? Be honest about this.
- What is the total cost of the headless build plus two years of maintenance, versus the same budget spent on theme optimisation and checkout improvements?
What we recommend
We have built headless storefronts and we have talked people out of building them. The right answer depends on the specific business.
If you are considering headless, the most useful thing to do first is a commerce audit: measure your current performance, identify where the actual bottlenecks are, and decide whether the architecture change is solving a real problem or a hypothetical one. We run these audits as a fixed-scope engagement and can usually tell you within a week whether headless is the right call for your store.
