Back to Catalog
Microservices
UI Patterns
Client-Side UI Composition
Each team ships its own UI component — client assembles the page from micro-frontends.
Intent & Description
Real-world Use Case
E-commerce page: Cart team ships CartWidget, Product team ships ProductDetails, Review team ships ReviewSection. Shell assembles them. Each team deploys their widget independently.
Source
📌 TL;DR
Micro-frontends = microservices for your UI. Teams ship their slice, shell stitches it together. Great for org scale, hard on UX consistency.
Advantages
- True team autonomy — frontend + backend owned end-to-end
- Independent deploy cycles per team
- Tech stack freedom per component (mostly)
- Scales to large orgs without frontend bottleneck
Disadvantages
- Consistency nightmare — every team invents their own design system
- Bundle size bloat if each component ships its own React
- Cross-component communication gets messy
- Shell/composition layer is its own engineering challenge