Exploring different techniques for the run-time composition of micro frontends

Omer Primor

Community Picks is a section on daily.dev where our community members share the most interesting and valuable content they've discovered online. From insightful articles to handy tools, every post is a gem curated by our dedicated coomunity. To contribute to Community Picks, you need to have at least 250 reputation points, ensuring that only active and trusted members can share their finds.

Community Picks

Building micro frontends allows for independent deployments and releases, autonomous teams, and modular codebases. Libraries like Webpack Module Federation, Single SPAs, and h-include can be used for run-time micro frontend composition. Reverse proxy composition provides convenient technique for project re-platforming, server side rendering, easy management, and no need for a container application. However, it is only suitable when the whole page is a single micro frontend, can cause delays in page loading, and may result in inconsistent page layout.

Run-Time Composition of Micro Frontends

You Don't Need Another Library to Compose Micro Frontends at Run Time

1. Reverse Proxy Composition — Each application is an independent SPA

2. Composition by lazy loading the micro frontends bundled using JavaScript