Scalable Web Development with Micro Front-ends

To meet the requirements of a rapidly evolving market environment and the expectations of different user groups, the demand for the realization of complex business applications by means of state-of-the-art web technologies is continuously growing.

This is precisely why the interest in microservices has been increasing significantly in the past few years. They help to split complex applications into smaller, more controllable components, enabling a clearer separation and thus a more agile approach.

More flexibility through microservices for web front-ends

While microservices have been part of the standard inventory for the back-end for years, allowing for parallel development by several teams, diversity in the technologies used and the flexible use of components of the application, many web front-ends still use a monolithic approach.

Due to the increasing complexity of the applications, the desire to integrate various specific applications into a single end-user application, and due to the short-lived technology stack, using a similar approach for the front-end as for the back-end is advisable.

Figure 1: Division of the front-end into different domains and teams

What is the main advantage of the so-called micro front-ends? Most projects where a complex front-end is being developed are based on a similarly complex back-end, creating a highly heterogeneous project setup. This makes working with a single development team ever more difficult, and the work is often divvied up among several teams. Due to the technical complexity and interdependencies, a monolithic approach in the front-end development often has a negative effect on the system’s maintainability. Micro front-ends allow for the same kind of parallelization and diversity that has long been the standard for the back-end in web development, too.

This approach aims at splitting the front-end up into several domains. As a result, it can be developed by several teams using different technological approaches. In the case of extensions or modifications, it is not necessary to redeploy the entire front-end, but it is possible to replace individual parts. The goal is for the user to get the impression of a single high-performance application, even though it is based on several different technical systems.

Lecture at online campus event (German only)

In our presentation at the first ZEISS Digital Innovation online campus event, we discuss for whom a monolith may still be profitable, and who should perhaps take a closer look at an architecture that is based on micro front-ends. We go into more or less complex project setups and their respective benefits and drawbacks. We also show the different web technologies that currently exist, which technology is suitable for one’s project, and the different possibilities of implementation.