Modernizing the development loop for legacy React apps

Finding the bottleneck

As a Lead Software Engineer at EPAM, I work on a customer product with separate repositories for operator and administrator interfaces. The applications had accumulated roughly a decade of history and relied on react-scripts, an older TypeScript version, and deprecated Material UI dependencies.

When I joined, slow application startup and poor hot reloading stood out as recurring obstacles. I proposed moving to Vite to improve the feedback loop for engineers working on these interfaces.

Making the migration actionable

An earlier migration attempt had been unsuccessful, and the work had been put aside. I proposed revisiting it with an AI-assisted workflow: map the codebase, identify dependencies, establish tests to catch regressions, and validate a small migration before expanding the work.

The first repository migration replaced react-scripts with Vite and took one day. A subsequent migration addressed Material UI and TypeScript. The companion AI engineering case study explains how I developed and refined the migration skills and used multiple agents for independent tasks.

Improving the development loop

Cold build time decreased by approximately 60%, and development-server startup time by approximately 70%. These improvements addressed the delays that originally motivated the migration.