Our frontend team inherited a 200,000-line React application. Single repo, single build, single deploy.
It took 12 minutes to build. 4 minutes to deploy. And nobody could confidently change anything without breaking something else.
Here's what we did and what it actually cost.
The Breaking Point
Three things forced our hand:
- Build times — 12 minutes CI for a CSS color change
- Merge conflicts — 4 developers, 1 codebase, daily conflicts
- Performance — 6MB initial bundle, 8s load on 3G
The Architecture We Chose
We split into module federation with Next.js:
- Shell app — routing, auth, shared layout (50KB)
- Dashboard app — analytics, charts, tables (200KB)
- Settings app — forms, preferences, billing (80KB)
- Editor app — rich text, media, preview (300KB)
Each team owns one app. They deploy independently.
The Real Cost
| Metric | Before | After |
|---|---|---|
| Build time | 12 min | 2-4 min |
| Deploy time | 4 min | 1 min |
| Bundle (initial) | 6MB | 350KB |
| Team conflicts | Daily | Rare |
But it wasn't free:
- Shared component library took 3 weeks to build
- CI pipeline redesign took 2 weeks
- Initial migration took 6 weeks
Total: 11 weeks of investment for a team of 4.
Was It Worth It?
Yes. Developer velocity increased dramatically. New features ship 3x faster because teams deploy independently.
The mistake we made: waiting too long. If your build is over 5 minutes and your bundle is over 2MB, start planning the split now.
Full migration guide with code: Codcompass
Top comments (0)