Shopify Hydrogen: when going headless is worth it

Hydrogen is Shopify's headless framework, built on Remix (React). It allows creating custom storefronts that consume Shopify's Storefront API. The result is full frontend control with edge performance via Oxygen (Shopify's hosting). But is it worth giving up Liquid's simplicity?

How it works

Hydrogen is a Remix project with Shopify-specific helpers: hooks for cart, product, collection and customer. Deploy happens on Oxygen (Shopify's global CDN) or any Node.js provider. Pages are server-rendered with streaming, ensuring fast LCP. The Storefront API provides catalog, checkout and customer account data via GraphQL.

Hydrogen vs Liquid: trade-offs

Liquid is simple: ready-made themes, visual editor, one-click deploy. Hydrogen requires a React team, build pipeline, hosting and more maintenance. Hydrogen's advantage: completely custom experiences, superior performance, integration with any additional backend and React component reuse. The downside: 2-3x higher development cost.

When it makes sense

Hydrogen makes sense when: the brand needs a unique visual experience that Liquid can't deliver, performance is a competitive differentiator, the team already works with React, or the store needs to integrate data from multiple sources (CMS, PIM, ERP) in the frontend.

When it doesn't make sense

It doesn't make sense when: the budget is limited, the team has no React experience, the store is simple and a well-built Liquid theme works, or the operation doesn't have the volume to justify headless infrastructure investment.