How to Survive a Frontend Rewrite Without Stopping Feature Work
The strangler fig approach to replacing your frontend — one branch at a time
Last year, a Series A fintech startup called me in a panic. Their React codebase — originally a weekend prototype — was buckling. Build times crossed four minutes. Every feature introduced regressions. The CTO said: "We need to rewrite everything, but we can't stop shipping for three months."
My answer: you don't have to stop.
Why Big Bang Rewrites Fail
The timeline doubles. Every rewrite estimated at 3 months takes 6-9.
The business can't wait. Competitors aren't pausing while you rewrite.
Morale collapses. Months rebuilding functionality that already existed.
You ship bugs you already fixed. The old code had years of battle-tested fixes.
The Strangler Fig Pattern
Build new features in the new architecture while old code continues serving users.
Step 1: Draw the boundary. New routes get new architecture. Existing routes stay on old code until ready.
Step 2: Build the bridge layer. Shared authentication, API client, design tokens. Both old and new import from this bridge.
Step 3: New features go new. Every new feature uses new patterns. No exceptions.
Step 4: Migrate by business priority. Which screens have the most bugs? Which change most frequently? Those migrate first.
Step 5: Sunset the old code. Once migrated, delete the old version. Don't leave it "just in case."
Real-World Timeline
| Phase | Duration | What Happened | |---|---|---| | Foundation | 2 weeks | New build tooling, bridge layer, design system scaffolding | | New features only | 4 weeks | All new development in new architecture | | High-pain migrations | 6 weeks | Dashboard and settings screens migrated | | Remaining migrations | 4 weeks | Lower-priority screens | | Cleanup | 2 weeks | Remove bridge layer, delete old code |
Total: 18 weeks. They shipped 11 new features during that period. The business never stopped.
Rules That Keep It Working
One direction only. New code never depends on old code patterns.
Feature flags, not branches. Control rollout with flags. Roll back instantly if needed.
Measure what matters. Track build time, bundle size, bug count week over week.
Communicate relentlessly. "We're paying down debt so we can ship Q3 40% faster" is a message stakeholders can rally behind.
If your frontend feels held together with duct tape, the fix doesn't require a three-month feature freeze — just a deliberate plan and the discipline to follow it.