Blog home

Composable Web Ecommerce

Heads up: why headless is the future of ecommerce

We analyze the advantages and disadvantages of headless commerce using example composable commerce websites.

Heads up: why headless is the future of ecommerce

The limitations of the monolithic approach

According to Statista, worldwide online sales reached $4938 billion last year, up 16% from 2020 and 47% from 2019. ecommerce now accounts for 19.6% of total retail sales. Of course, lockdowns have contributed to the change of consumer habits — but this major shift would have been impossible without the streamlined customer journey offered by modern ecommerce.

The pursuit of ever-rising user experience standards, the sky-rocketing share of mobile traffic, and the increasing complexity of customer journey and business models have created new challenges for the technical side of the ecommerce business. In this context, the traditional “monolithic” architecture — where a single application contains all the business logic — has shown its limits.

Even though “all-in-one” platforms may include a complete list of features and add-ons, they are usually good only as long as everything you do fits into their logic. Whenever one wants to go beyond the most standard use cases, the difficulties begin. Since the platform is closed, it’s rather complicated to do something that would set your ecommerce apart. Even when it’s possible, you'll have to master the existing code and probably rewrite a lot of it to tailor the functionality to your needs.

What is Headless Commerce?

The headless commerce architecture has appeared to solve this problem. The following diagram by Front-Commerce gives an overview of the change it brings, compared to the monolithic architecture:

Comparing monolithic and headless approaches
Comparing monolithic and headless approaches

A headless commerce can be defined as a platform whose whole back-end logic is available via APIs, so that it can be easily connected to any front-end service. The beauty of this approach? You can easily update any front-end service without affecting the other system elements. (Another positive consequence of services independence: faster web performance).

This advantage is nicely illustrated by the following comics by Crystallize:

Headless architecture advantages
Headless architecture advantages

Interestingly, the term “headless commerce” has stuck to the rapidly spreading practice of decoupling the front-end and the back-end rather spontaneously in early 2010s. In 2020, Gartner proposed a close term of “composable commerce”, which underlines the advantages of using best-of-breed solutions.

By now, all major incumbent ecommerce platforms feature a headless option. The list includes Salesforce Commerce Cloud, Shopify Plus, Adobe Commerce Experience (formerly Magento 2), WooCommece, BigCommerce, Elastic Path Commerce cloud. However, their API layer is very much influenced by the logic of their legacy frontend.

This makes it all the more interesting to compose the back-end with a set of independent microservices, or look at the ecommerce platforms that originally started with APIs. The list of such pure-player headless ecommerce platforms includes CommerceTools (a pioneer of MACH approach), Centra (specially designed for fashion and apparel brands), Spryker, V-Tex.

Who should go headless?

Going headless is particularly practical for companies who:

  • aim to offer cutting-edge online shopping experience (shoppable video, social commerce, etc)
  • use to make frequent updates and additions of new features
  • have an omnichannel presence
  • combine online services and physical products (think of a cosmetics company offering a free skin analysis by photo, followed by product recommendations)
  • accept alternative means of payment (Buy-Now-Pay-Later services, 1-click checkout, Facebook Pay, etc) or sell subscriptions
  • implement custom loyalty programs

Who shouldn’t go headless?

Of course, this flexibility has a certain cost in terms of complexity. The services will need to interact with each other, which requires some work on their integration and maintenance. Secondly, each service is a potential point of failure, so it is very important to preview fallbacks and pick up providers carefully.

Therefore, headless architecture isn’t necessarily the optimal choice for the smaller businesses who lack resources to maintain an in-house developer team or work with a web development agency on a regular basis.

Use cases of headless commerce architecture

By 2022, the most widespread ecommerce platform is still the old-school monolithic version of WooCommerce (the data comes from the latest JAMstack community survey). However, headless commerce is rapidly gaining ground, both among the larger ecommerce websites and the dynamic, such as Envie De Fraise.

Here are some examples of modern B2C headless ecommerce websites with a brief glance on their tech stack:

  • Bang & Olufsen — CommerceTools + Contentful CMS + React/Next.JS
  • Devialet — Magento 2 Headless + Front-Commerce
  • Desertcart — Strapi CMS + React.JS
  • Tediber — Sylius CMS + Vue.JS/Nuxt
  • Theory — SFCC Headless + Amplience CMS + React.JS
  • Volvo — SFCC Headless + Fabric CMS + React.JS

Conclusion

Headless commerce brings faster time-to-market and facilitates experimentations. The top-level user experience is easier to achieve when integrating best-of-breed services to a composable system. Some of the success stories of migration to headless boast double-digit raises of SEO traffic and conversion rate. Headless is clearly the optimal and future-proof architecture for established brands, given its benefits for the omnichannel experience.

It is also a natural choice for the most dynamic DNVBs.