Skip to content
Frontend Architecture Patterns

Micro Frontends

Micro Frontends bring the microservices philosophy to the frontend world, enabling multiple teams to work and deploy independently.

Composition Strategies

Section titled “Composition Strategies”
  • Build-time: Modules are composed during the build process (e.g., via NPM packages).
  • Server-side: Fragments are combined on the server (e.g., SSI, Edge Side Includes).
  • Client-side: Composition happens in the browser via iframes, Web Components, or Module Federation.

When it works well

Section titled “When it works well”
  • Large organizations: Multiple autonomous teams (10+) working on a massive ecosystem.
  • Independent deployments: Deploying a feature without affecting or coordinating with the rest of the site.

When it becomes problematic

Section titled “When it becomes problematic”
  • Performance: Duplicate dependencies and runtime orchestration overhead.
  • UX Consistency: Maintaining a unified look, feel, and navigation behavior across independent apps.
  • Security: Managing cross-origin concerns and sandboxing (if using iframes).
  • Governance: High overhead in coordinating shared standards and infrastructure.

Technical Complexity

Section titled “Technical Complexity”

Very High. Requires specialized orchestration, sophisticated CI/CD, and a mature platform team.

Section titled “Related Patterns”

Learn More

Section titled “Learn More”

For a deeper dive into micro frontend architecture patterns, team independence strategies, and real-world enterprise implementations, check out the book Micro Frontends Architecture for Scalable Applications.