March 15, 2023
•
7 min read
Last year, Shopify announced their investment in headless commerce with Hydrogen & Oxygen, their new headless frameworks. Almost a year later, with the launch of Shopify Editions, Hydrogen & Oxygen has officially gone live. And with it, improvements and updates that will be sure to set this framework in the sights of big brands and ambitious e-commerce managers. To save you the research, we’ve rounded up everything we know so far, what the updates are and what all of this means for headless commerce. So let’s get into it…
Announced at Shopify Unite 2021, Hydrogen is Shopify’s answer to an easier, sleeker, headless build for developers and an exciting experience for customers navigating a Shopify store. The new framework from Shopify uses a React-based framework that allows custom storefronts with greater personalization opportunities that can be built quickly and don’t compromise site performance.
Before, your e-commerce development team usually had to trade-off between epic site speeds or beautifully designed experiences. But, with Hydrogen bringing together a host of technologies, including our partners: Nosto, Sanity, Contentful, Klaviyo, ReCharge, Okendo, and Aloglia, they’ve made it possible to achieve both exceptional site performance and dynamic user experiences.
We’re pleased to launch with Hydrogen to provide the best experience and support for our customers looking to migrate to a headless solution powered by Shopify and the Hydrogen stack. We’re here to help merchants build authentic and relevant online commerce experiences at scale.
Jim Lofgren
CEO, Nosto
To put it simply - Oxygen is a Shopify hosting platform that enables you to host Hydrogen storefronts directly on Shopify Plus. This is a big yes from us - usually, with headless, you need a third-party platform to host frameworks, but Oxygen makes that need redundant. Instead, you can seamlessly integrate with Shopify’s Storefront API, deploying multiple different Hydrogen storefronts to preview, share, test, and experiment with.
As for how it holds up for Shopify merchants? Oxygen was built to withstand large amounts of concurrent traffic for big sales like Black Friday without the chance of crashing and, deployed globally, for exceptional international selling experiences.
Shopify officially launched Hydrogen in June 2022, including a few updates. Here’s a complete rundown of all the new features Shopify have added and made to its Hydrogen & Oxygen frameworks:
As part of their official Hydrogen & Oxygen roll-out, Shopify have partnered with and invested in CMS tool, Sanity. Sanity is a completely customizable CMS tool that can be built from the ground up by developers and content owners alike. For this partnership, the team at Sanity has created a content application tool unique to Shopify’s Hydrogen & Oxygen. This will allow merchants to keep their products, variants, and collections on Shopify, their front-end synchronized with Sanity their CMS.
We’re excited to share that we've entered into a strategic partnership with Shopify and that Shopify has made a significant investment in Sanity. Together, we are making the integrations between our headless offerings seamless, creating an unparalleled opportunity for brands wanting to create exceptional experiences. This is a validation of how far our technology has come and how strategically important content is for the future of e-commerce. We are the first and only investment Shopify has made in a content platform.
Magnus Hillestad
CEO & Co-Founder of Sanity.io
Also up as a preferred CMS partner is Contentful. Contentful is one of the fastest-growing CMS technologies available today, so it’s no surprise that they were chosen to be a preferred vendor for the initial release of Hydrogen & Oxygen. Their API-first approach means that brand content, whether articles or product information, can be everywhere you sell your products, translated and updated in real-time with accuracy. Utilizing Hydrogen & Oxygen with a preferred partner like Contentful creates a powerful stack for any brand.
It is worth noting that other CMS’ can still be implemented into your headless stack. However, at this time, it will require a custom integration which may take more time than if you were using Sanity or Contentful.
With all the buzz surrounding Hydrogen, Shopify has updated their API to accommodate the new framework. Up until this point, the storefront-API has been unsuitable for server-side applications. For a merchant, this means you could hit the rate limit, which impacts your site's overall functionality. This update allows the server to make requests on behalf of the merchant, working for many users without hitting a limit, opening up server-side operations that were too risky previously.
In 2021, when Shopify first announced Hydrogen & Oxygen, there was concern surrounding the app integrations. Shopify has an extensive app store, with some favorites being a core part of merchants' tech stack. But, without an API integration for these apps, middleware was looking like the only option. Shopify has since announced a list of tech stack must-haves that are ready to be integrated into Hydrogen from the get-go meaning merchants won’t have to sacrifice their beloved tech solutions.
Create a unique subscription experience for your customers with Hydrogen & Recharge. We are excited to be the first subscription app compatible with Shopify's headless solution for merchants. Together, we are able to provide developers the flexibility & freedom of creating a custom subscription offering.
Ryan Forster
Partnerships Manager EMEA, Recharge
Working with over 70% of Shopify Plus brands, Klaviyo understands the need to adopt and support new technologies. That’s why we’re excited to be a part of the Hydrogen release, being one of few partners who are ready for and committed to the rollout.
Michael Worthley
Senior Manager and Solution Architect, Klaviyo
With the announcement of Hydrogen & Oxygen last year, and now that it’s officially launched, it becomes more and more apparent that headless is the future of e-commerce and Shopify is paving the way. Shopify has a habit of removing barriers for their brands, and Hydrogen & Oxygen is no different - with this launch they’ve opened up headless to a broader array of merchants, not just those with high revenues and large customer bases. For brands, headless (and indeed Hydrogen as a headless framework) means new opportunities to iterate and adapt to changing demands faster, increasing their conversion rates. And, for their customers, faster, richer experiences from their favorite stores becomes the norm.
Hydrogen lets you get many of the advantages of headless whilst keeping the benefit of being tightly coupled to Shopify, plus you never have to worry about infrastructure again using Oxygen, Shopify's new hosting service. You can scale to millions of users while keeping operational costs low and fast-track to market.
Alex O'Byrne
Co-Founder and Director, We Make Websites
Hydrogen is also hugely important for the technical future of the web as its use of React Server Components is pushing React’s own roadmap. This shift means developers and agencies can take their best practices, constrained by monolithic architectures, and accelerate the development process, with better performance and design freedom and simplify the ability to personalize the online shopping experience.
Regardless of which headless framework you decide is 'best,' it's clear that a major platform, Shopify, investing in and launching this route to headless for their merchants will directly impact how brands consider building their e-commerce stores for the future.
