ReactJS vs AngularJS vs VueJS
Angular and React are the two big players that everyone is using. Which is better, React.JS or Angular? Is React killing Angular? Is React faster than AngularJS?
Walmart Case Study: Migrating Angular 1.x apps to React
Ankur Tiwari is a lead full-stack engineer at WalmartLabs e-commerce division. It is a small team of 3–5 full stack engineers, building and supporting an ecosystem of web apps that are primarily built on Node/Express/Angular 1.x stack. They use Webpack 2 as their task runner with code written in ES6 that gets transpiled into ES5 through Babel. The client side is an angular SPA which talks to the Node layer. The Node layer integrates with Couchbase DB and other backend systems through REST APIs with JSON being the data exchange format. They have about 25 front-end reusable angular custom directives shared across 3 web apps.
Ankur Tiwari noted that "Angular 1.x is pretty notorious in terms of performance when it comes to nested scopes and watchers. The problem becomes more prominent when you have custom directives built on top of open source directives. Imagine these directives composing a view that also involves multiple Ajax requests. That being said, Angular performance would have been pretty normal to me if I had not discovered the gains with React".
As an experiment, he decided to take the most complex view of the app and re-created it with React to understand the differences between Angular vs React performance.
Here’s what his Chrome JS Profiler said:
Chrome JS Profiler results with Angular. Source: https://medium.com/walmartlabs/migrating-angular-1-x-apps-to-react-the-hybrid-way-3267ccf33755
Chrome JS Profiler results with React. Source: https://medium.com/walmartlabs/migrating-angular-1-x-apps-to-react-the-hybrid-way-3267ccf33755
As you can see above, there is a 35.5% reduction in scripting, 62.5% in rendering and 39% in Painting with an overall reduction of 1.5 seconds in view rendering!
Ankur Tiwari summarised why he chose React: "There were obvious technical reasons to try out React over anything else. It makes rendering/re-rendering of DOM nodes lightning fast. Not to mention it’s revolutionary concept of virtual DOM and only updating real DOM when needed through tree diff mechanism. Also, Electrode being WalmartLabs homegrown platform for web apps which is built on top of React and Hapi, it’s always better to have Electrode ready React components for any future web app to be written with it".