Exploring Micro Frontends: A Case Study Application in E-Commerce

TL;DR

This paper investigates the adoption of micro frontends in industry through a case study in an e-commerce marketplace, evaluating its benefits, challenges, and comparing it with alternative solutions.

Contribution

It provides an empirical case study of implementing micro frontends in a real-world e-commerce setting and assesses its advantages and limitations compared to other approaches.

Findings

Micro frontends improved developer experience and scalability.

Adoption was facilitated by existing microservices and infrastructure reuse.

Alternative solutions like monolithic frontends could have sufficed.

Abstract

In the micro frontends architectural style, the frontend is divided into smaller components, which can range from a simple button to an entire page. The goal is to improve scalability, resilience, and team independence, albeit at the cost of increased complexity and infrastructure demands. This paper seeks to understand when it is worth adopting micro frontends, particularly in the context of industry. To achieve this, we conducted an investigation into the state of the art of micro frontends, based on both academic and gray literature. We then implemented this architectural style in a marketplace for handcrafted products, which already used microservices. Finally, we evaluated the implementation through a semi-open questionnaire with the developers. At the studied marketplace company, the need for architectural change arose due to the tight coupling between their main system (a Java monolith) and a dedicated frontend system. Additionally, there were deprecated technologies and poor developer experience. To address these issues, the micro frontends architecture was adopted, along with the API Gateway and Backend for Frontend patterns, and technologies such as Svelte and Fastify. Although the adoption of Micro Frontends was successful, it was not strictly necessary to meet the company's needs. According to the analysis of the mixed questionnaire responses, other alternatives, such as a monolithic frontend, could have achieved comparable results. What made adopting micro frontends the most convenient choice in the company's context was the monolith strangulation and microservices adoption, which facilitated implementation through infrastructure reuse and knowledge sharing between teams.