# Server-Side Page Fragment Composition

> Each team generates their HTML slice server-side — a compositor stitches fragments into a full page.

- **Category**: Microservices
- **Subcategory**: UI Patterns
- **Canonical URL**: https://designpattern.fyi/patterns/server_side_page_fragment_composition/

---

## Description
Clean, reusable architecture pattern.


## Use Cases
Product page compositor calls /fragments/product-details, /fragments/reviews, /fragments/recommendations. Each returned by the owning team's service. Compositor assembles and returns one HTML page. Browser gets a complete, SEO-friendly page.





## Trade-offs


### Advantages

- Server-rendered = SEO friendly, fast first paint

- Team ownership extends to full UI stack

- Fragment caching at CDN = scalable

- No JS required for initial render




### Considerations & Drawbacks

- Compositor is a bottleneck — must aggregate N requests server-side

- Page assembly latency = slowest fragment (mitigate with timeouts + fallbacks)

- Consistent design system still needed across team-owned fragments

- More complex than a single server-rendered app







---
**Reference**: [Original Source](https://microservices.io/patterns/ui/server-side-page-fragment-composition.html)