Contents
“Hydrogen” and “Liquid” often come up in the same sentence without the difference being clear to anyone who isn’t coding day to day. Here is what it actually changes, without unnecessary jargon.
Liquid, Shopify’s historical foundation
Liquid is Shopify’s native templating language. When you install a theme (free or paid), it’s written in Liquid. The Shopify server generates the HTML page directly from these templates, with content from the back office injected into them.
It’s a proven system, quick to set up, and it covers the standard needs of a classic e-commerce site well. The trade-off: you work within the limits of what the theme and Liquid allow. Every somewhat advanced customisation goes either through a third-party app or through custom Liquid code added to the theme, which tends to pile up over time.
Hydrogen, Shopify’s headless framework
Hydrogen is a React-based framework (via Remix) provided by Shopify to build a fully custom storefront, which talks to the back office through an API rather than through direct templating. The storefront runs on Oxygen, Shopify’s edge hosting.
In practice, this means the front end (what the customer sees) is completely decoupled from the back end (catalogue, orders, payment). You keep the Shopify admin exactly as it is for operations, but the public-facing site becomes a full development project, with total control over every element displayed.
The differences that actually matter
Performance. A Liquid theme loaded with third-party apps accumulates scripts that slow down rendering. On Hydrogen, there are no front-end apps in the classic sense: features are coded directly, which removes this near-systematic slowdown factor found on older themes.
Design freedom. On Liquid, every custom interaction means working within the theme’s constraints. On Hydrogen, there’s no theme constraint since the front end is built from scratch. Whatever can be imagined in React can be built.
Development cost. This is the real trade-off. A customised Liquid theme costs less to set up than a full Hydrogen storefront, because you’re starting from an existing base. Hydrogen requires a genuine development project, which makes sense once Liquid’s limitations become a real business bottleneck, not systematically.
Maintenance. A Liquid theme can be maintained with standard Shopify skills, widely available on the market. A Hydrogen storefront requires React/Remix skills, a more specific profile but also one more aligned with the modern dev ecosystem.
Speed of product iteration. On Liquid, adding an advanced feature often means looking for a compatible app, with the dependency risk and recurring cost that comes with it. On Hydrogen, the feature gets coded directly, with no third-party dependency or extra subscription.
When Liquid is still enough
This isn’t about saying Hydrogen is always the right answer. A small catalogue with standard needs, little advanced customisation and a limited dev budget is still perfectly well served by a well-maintained Liquid theme. Moving to Hydrogen makes sense once performance, design or product development speed become measurable barriers to growth.
How to know where you stand
The signs that a Liquid theme has hit its limits: a Core Web Vitals score that stays flat despite standard optimisations, an app bill that grows every quarter, or a product roadmap slowed down because every new idea runs into the theme’s constraints.
If that’s your situation, the Shopify to Hydrogen migration path details how the initial audit checks whether going headless is actually justified before committing to it.