The great Angular to React migration

The great Angular to React migration

PC: India Today.

Fourth time's the charm

Back in the day about 6 years ago, we built Fabrik. And it was ordained that we build on Angular. For the first 2-3 years ago Angular worked well, it was easy to setup, good documentation, quick to get started, fast build/compile times, and a small team to put high quality pilots together quickly. I guess it's true that software lifecycle is about 3 years before the next generation of frameworks/technologies takes over. That happened with us too. As we received feedback from customers and tried to implement changes, things became more complex. We wrote hundreds of lines of unnecessary code to make something work, and given the time crunch we always worked with, everything was a patch, a hot-fix, etc. and this technical debt comes back to bite us in the back even today. We managed to maintain and optimise the Angular build multiple times, but we were clearly lagging and it was only time before changing the architecture of the platform. we recognised limitations as the platform grew more complex. After many false starts, we finally nailed down the frameworks that will scale Fabrik for the next half decade, and the winners are React with ViteJS. Deciding on migration is one thing, finding the people, time, and bandwidth is quite another!

Infact, we have failed to migrate from Angular to React thrice. I assumed it was third time's the charm, but I guess the charm is in getting everybody onboard, and only then does the charm work. We previously failed because:

  • we were not sure if the timing was right (it never is),
  • we did not have enough hands (we will never have),
  • we do not have enough experience (it's the era of ChatGPT, no one will ever have enough experience anymore),
  • is there a market need - current solution works well, so why change? (sort of legit),
  • you can add more reasons here.

But, after a few attempts, the great migration is finally upon us!

Angular v. React

The DQI (Developer Quality Index), a term that I made up is good in Angular, so why is the migration happening now? (It's a reference to Delhi's AQI, read up.) Turns out, we cannot find talent for Angular anymore. And as a direct consequence, maintenance of Angular framework is poor for the work we do. Outside of established e-commerce or related applications, very little cutting edge action happens on Angular. Since little cutting edge is on Angular, everyone is learning React and there are fewer people on Angular to contribute to the framework. The cycle continues, none of the talent find it worth their while to put in effort and maintain Fabrik on Angular. Despite the era of text-to-code AI apps where Angular <-> React translation is fairly straight-forward, we are unable to get talent enthused to work on Angular.

Daulatabad is great, but it ain't Delhi - Muhammad bin Tughluq.

From some of our most trusted sources, here's the top five reasons why our team swears by React:

  1. Component-based architecture - React's component-based architecture allows us to isolate each functionality quickly, enabling us debug, enhance, and maintain much faster.
  2. Performance bottlenecks - Angular's two-way binding and heavier runtime often adds delays in run-time updates. For digital twins, that's a strict no-no.
  3. React Three Fiber - the React renderer for ThreeJS creates a unified approach to handle content and UI reducing a lot of complexity.
  4. Fewer boilerplates - JSX's syntax and declarative approach simplify development with clean and maintainable code.
  5. Ecosystem - a large community of developers with a growing ecosystem of libraries just makes everything faaaaaast!

So, here we are with React3Fiber

After multiple failed attempts, we finally put a foundation for transitioning Fabrik to React3Fiber, #R3F over the last 3-4 months. The framework provides all the advantages of scale with the visual richness that's become standard practice for anything 3D. We have many many many services like collaboration, annotation, no-code studio, environment settings, model performance, hosting, video components, etc. and each of these components should be backward compatible with our current Angular setup with live customers. The migration is a thoughtful process, meticulous and well-planned (sounds familiar?), but the outcome is far more certain. What happened to Angular will likely happen to React, but we foresee 3-5 years before transitioning to the next generation of tools. But this time, I hope we will do a much better job in change management, do it faster, in a timely manner, and efficiently.