Vercel and Shopify rebuild Hydrogen as an open-source, runtime-agnostic framework

At the Vercel Ship 26 conference in New York, Vercel and Shopify announced a complete rebuild of Hydrogen, their headless commerce framework. The new Hydrogen is open source and runtime-agnostic, so it will run in any environment that executes JavaScript instead of being tied to a specific stack.

What changes in the new architecture

Hydrogen used to make headless storefronts easier to launch, but it didn't port well between stacks. The new version is open and not tied to any runtime: developers will be able to build a store with Svelte, Nuxt, Next.js, or their own framework.

• The announcement came at the Vercel Ship 26 conference in New York
• The new Hydrogen is open source and runtime-agnostic
• It supports Svelte, Nuxt, Next.js, and arbitrary frameworks
• The architecture is split into three layers: core, client, and server

How the core layer works

Previously, every team wrote its own "glue" code to work with the Shopify API. Price formatting is one example: the API doesn't return a number but its own MoneyV2 type, which encodes the amount as a string. That logic now lives in a shared core layer built on the standard Intl.NumberFormat. Developers call the ready-made formatMoney function and get a formatted price without writing and maintaining their own wrapper. When the Shopify API changes, updating becomes trivial instead of a manual fix in every project.

What the client layer does

The client layer handles recurring rendering decisions, starting with cart state. Until now, anyone building a commerce app wrote their own cart provider: methods to add, update, and remove line items, discount handling, currency support, error states, and sync across browser tabs. In the new Hydrogen, cart state comes from a single import of the useCart hook rather than being rewritten in every project.

What it means

Vercel and Shopify are moving repetitive online store logic — price formatting, cart state — into a shared open layer that gets fixed and improved once for everyone. Teams no longer have to solve the same problems over and over on their own stacks.

FAQ

Which frameworks can you use with the new Hydrogen?

The framework is runtime-agnostic and explicitly supports Svelte, Nuxt, and Next.js, and it also lets developers plug in their own framework.

What layers make up the new Hydrogen architecture?

The developers define three layers: core (shared logic for working with the Shopify API), client (UI and cart state), and server.