Blog home

Composable web

How Composable Architecture Is Reshaping the Web

Headless systems are changing the way we build websites. Online brands need to keep up to stay relevant in competitive markets.

How Composable Architecture Is Reshaping the Web
This article is based on our webinar on headless architecture for ecommerces. Watch the replay (in French.)

Headless systems are changing the way we build websites. Online brands need to keep up with these new technologies to stay relevant in their competitive market.

What are the origins of headless systems?

Initially, solutions had been operating as a single block, a monolith, that ran all the computer systems in one. In other words, the services and functionalities used by companies and websites depended on a global structure that conditioned their design and evolution.

Today, companies and developers are turning to a new system called headless, which is based on associating best-of-breed technologies. Composability enable websites to evolve faster. Companies are now relying on several partners for each service they have on their website such as payment, front-end design, media storage and optimization. The main advantages being: quick-acting, flexibility, adaptability, and scalability.

What is a headless architecture?

If we consider that the head corresponds to the front-end (customer facing website), while the body of the site corresponds to the back-end, we can say that one was depending on the other. Indeed, the customer facing website was dependent on the back-office, and was often even generated by it. This was leading to a lack of flexibility for websites.

In the 2010s, the rise of front-end frameworks fast-forwarded the separation of systems. Their goal was to manage to separate the front-end from the back-end in order to be able to modify one independently from the other. This allowed the development of the front-end and the back-end in isolation.

In fact, it is possible to keep the old structures but manage to modify the front end without having any impact on the back-end, as for example Front-Commerce did with its client Devialet. Indeed, thanks to its front and back-end split, Devialet was able to improve its organic traffic by +25% and its conversion rate by +100%.

Devialet homepage
Devialet homepage

Keeping the legacy back-end technology while developing a new front-end can allow websites to evolve in stages. When the front-end is finally independent from the back-end, brands can move towards a complete restructuring of their websites. They will then look more like native headless websites, which we can see emerging in the second phase of development of headless systems.

The massive growth of front-end stacks gave birth to a large number of API-first services (2015). We can find CMSs like BigCommerce or Sylius, PIMs like Akeneo, DAMs, but also everything concerning cloud commerce and services within the company (payment solutions, research, analysis, etc.), or even some original solution created internally by companies themselves.

These specialized solutions are linked via an API that can allow them to be combined in order to form a complete front-end and back-end architecture. Both teams can be more independent thus develop without influencing each other and at the same time benefit from the best solutions in each of their fields.

Headless architectures’ advantages in a Composable Web context

In contrast to the compact and monolithic structures, headless architectures are composed of several web solutions, each one with a different function, built as a whole. Companies using this system are thus completely in control of their technical roadmap and do not depend solely on one supplier: this is the beginning of composable web and composable commerce.

Digital commerce platforms are experiencing ongoing modularization in a cloud-native, multi-experience world. Application leaders responsible for digital commerce should prepare for a “composable” approach using packaged business capabilities to move toward future-proof digital commerce experiences. — GARTNER

The bricks used in a headless system allow the overall structure of the website to be maintained. The website architects can choose the different bricks they wish to use. This choice may correspond to obligations given by the company or to preferences prior to the design of the site. However, developers will always seek to use the best solutions available in each area to ensure that their structure is as modern as possible.

Flexibility of headless systems is favoring the progressive construction of a website. Thus, because each solution has its own features, each team chooses its own tool and can customize it as they wish.

The change of technology also becomes easier. When a technology is overtaken by another one (in terms of efficiency and performance), the old one can easily be replaced by the new one, since only one part of the site is to be changed and not the whole entity.

The aim of the approach is also to get out of the “tunnel effect” created by large monoliths. With different solutions, we can be sure that the slightest evolution will not have a negative impact on all the blocks (both on the businesses and on the customers), but rather smaller changes that are easier to adapt to.

Headless coding
Headless coding

Headless architecture enable developers to iterate faster on their user experience to create digital experiences that are more engaging. The composable approach allow webites to benefit from best-of-breed solutions to create a performant, reliable, and tailor-made solutions. All those benefits have proven impact on business metrics such as conversion rate.