fe-micro-frontends

Build independent frontend applications by implementing a micro-frontend architecture using an MFE, BFF, and SDK triad. This enables autonomous teams to independently develop and deploy features that compose into a unified user experience without coordinating releases.

Common micro-frontend pitfalls include incorrect architectural granularity and implicit coupling between applications. Avoid these by managing shared dependencies, externalizing heavy libraries, and preventing shared state across independent frontend applications.

Micro-frontends handle cross-application communication using events or callbacks to avoid shared state. Composition patterns implement runtime integration via JavaScript or SDK hooks to compose independent frontend applications into a unified user experience.

A BFF and SDK are part of the micro-frontend triad owned by a single team. This structure supports independent deployment by managing shared UI components and providing runtime integration hooks for the independent frontend applications.

The best way to test independent frontend applications is to define testing approaches that validate isolated components and cross-application communication strategies. This ensures independent deployment capabilities without relying on the unified user experience runtime.

You should not use micro-frontends when a large e-commerce platform scale is unnecessary or when teams cannot manage shared dependencies. Avoid this frontend architecture if independent deployment and cross-application communication via events add unwanted complexity.