Glossary Background Image

No Bad Questions About Frontend development

Definition of Microfrontends

What are microfrontends

Explore the world of microfrontends, the microservice approach to web UI development.

Microfrontends: definition

Microfrontends refer to an architectural style where a front-end application is broken down into smaller units that are independently deployable and scalable. Each unit, known as a microfrontend, corresponds to a specific business capability and can be developed, deployed, and scaled independently.

Microfrontends are loaded as needed, interacting with data directly without relying on a centralized server for routing or data processing. This approach offers flexibility and enables the display of only necessary components for a specific page. It also supports autonomous development, deployment, and scaling of individual microfrontends, fostering modularity and flexibility in front-end application architecture.

There are 3 types of microfrontends: 

Monorepository 

When all projects exist within the same repository. Despite seeming contrary to the independence of microfrontends, it centralizes projects with shared dependencies.

Multirepository

When projects are in separate repositories, each has greater isolation and independent dependency systems.

Metarepository

A blend of monorepository and multirepository strategies. While multiple repositories exist, there's an additional one that integrates projects, combining advantages and mitigating drawbacks of monorepository and multirepository approaches.

What is the difference between microservices and microfrontends?

Microservices and microfrontends are both architectural approaches that aim to break down monolithic structures into smaller, more manageable parts. However, they focus on different aspects of an application. Here are some key differences: 

  • Microservices address backend concerns like business logic and data processing, while microfrontends address frontend concerns such as user interface and presentation.
  • Microservices are backend services deployed on servers, while microfrontends are frontend components deployed on the client side, typically in the user's browser.
  • Microservices communicate with each other over a network, while microfrontends often communicate directly with backend services or APIs.

When should you use the micro frontend?

Microfrontends can be beneficial in various scenarios, and their adoption depends on the needs and characteristics of a specific project. Here are some examples of how microfrontends can come in handy:

  • Microfrontends enable independent work, fostering faster development and simplified maintenance.
  • Encourage the use of diverse frontend technologies for different application parts.
  • Support independent scaling of frontend sections based on varying resource needs.
  • Facilitate independent deployment of changes, speeding up releases and minimizing error risks.
  • Enable the creation of reusable front-end components for different projects.
  • Support gradual migration from a monolithic to a modular architecture.
  • Help sort out UI components, styles, and functionality for easier management.
  • Assist with the management of large-scale applications by breaking them into smaller parts.

Key Takeaways

  • Microfrontends break down a frontend app into deployable units. Each of them represents a business capability that can be independently developed and scaled.
  • Microservices handle the backend, business logic, server deployment, and network communication. Microfrontends manage frontend and UI, deploy on the client side, and directly communicate with backend services or APIs.
  • Microfrontends enable independent development and scaling of specific frontend components, fostering flexibility and autonomy in the architecture.