Angular vs. React vs. Vue: A 2017 comparison
Jens Neuhaus
29K122

Why companies should use Angular over React.JS

I (Gordon T Cumming) have been into AngularJS (Angular 1.x) since 2012 and then Angular from the start — 2014 when Angular 2 was in its many alpha releases and have lived and breathed it ever since, with it now (Oct 2017-rc.6) almost at 5.0.0 — Although I’m from a .NET C# background.

Angular is a complete mobile first, opinionated framework — created by Google, meaning it has everything a company needs to create a fully featured application — which can run on the Web, mobile devices (iOS and Android) and Desktop — compared to React which is just a library.

Angular — originally Angular 2 (Sept 2016), then Angular 4 (April 2017) and now Angular 5(Oct 2017) 
 It is a more complex framework to learn, which entails, 
 being written in TypeScript language (based on EcmaScript stds) using the Webpack (Module loader), RxJS (Reactive Extensions for JavaScript) and Observables.

It has lots of features but these provide you with an application which is 
 very responsive, fast, scalable, understandable|maintainable, testable and small (usually Kbs)

(unit|integration|end to end)

Angular is a Component based framework with a component tree hierarchy with the AppComponent as its root, but also has Modules normally 1 AppModule which holds all the Components, but then as the application grows, it lets you create other feature modules — each with its own set of Components and hence forming a module hierarchy. These feature modules allow for an Angular feature called Lazy Loading whereby — we only load the module which we want to initially use and then lazy load the rest. These can be loaded in the background (aided by Pre-rendering) so these modules can then be loaded quickly when eventually needed.

Angular also can use AoT (Ahead of Time) Compilation — whereby the app’n is compiled offline and then the Compiler is removed from the code (50% size reduction) This also means security is better.

Server side rendering (SSR) via Angular Universal means we can initially load only HTML + CSS and then load the Angular (JavaScript) in the background) — which means a lightning fast load. 
 
 Although Angular is complex, it makes getting started very easy — especially due to the Angular-CLI — with ng new myProject creating a complete Angular application.

- which includes Components| Modules| Bootstrapping |Styling but also routing, testing (unit|E2E)

It has simple commands to add Components| Directives| Pipes| Modules| Services| Guards |

Angular is normally written in TypeScript which although a bit more complex to learn, it makes writing application code much easier than JavaScript and this code is much simpler to understand and maintain. It provides strong static typing, interfaces, classes and inheritance. Hence this makes it look like a high level language for other developers. It is based on EcmaScript — the modern JavaScript and so lets you write code using modern JS features like (x)=> (x+1) instead of function(x){ return x+1;} This means when modern browsers implement these ES stds — it will be much faster.

Webpack utilizes tree-shaking — a way to remove unused code from modules to minimize the size of applications and produce a set of small JS bundles as the final output code.

The original AngularJS used Promises — for asynchronous code, but Angular uses Observables and RxJS (Reactive Extensions for JavaScript) which helps make Angular very responsive. Observables have advantages of being chainable, cancellable but also can be converted to Promises if required.

Angular has more and more features coming out with each release (a new major release + 6months) with the Angular-CLI being modified to include Schematics to manipulate File systems and utilize Object Models. These features help to speed it up, make it more responsive, faster, more testable and reduce its size. It also has features coming to allow for testing — force SOLID principles.

ReactJS is just a library and requires many other libraries to implement a complete application.

It is a UI library which has extremely fast change detection — due to its virtual DOM and was created by Facebook to compete and be faster than AngularJS (Angular 1.x).

It is smaller and easier to learn but does not have the features of Angular built in to it — It requires many other 3rd party libraries to be added to create anywhere near the functionality of Angular.

React is written in JSX which although relatively simple, it is JavaScript based language but does not cater for the modern JS (EcmaScript) features.

React applications normally use Flux (more likely Redux) for large scale applications — this uni-directional store with Actions and Reducers — is also used by Angular for large scale applications but Angular normally uses ngrx.

Many companies started using ReactJS when they realized the problems with AngularJS (Angular 1) with its lower speed and change detection problems of $digest cycle and $scope.apply() — and also due to Google taking 2 years to finalize the Angular 2.0 (Sept 2016). These companies may feal they are stuck with React, but for new companies or companies that have recently started using ReactJS, Angular is definitely the better more professional way to go. Especially for large scale, enterprise applications, then Angular has lots more advantages and features built into it rather than the liquorous allsorts, cocktail, concoction of ReactJS.

React although fast has a problem with its GC (Garbage Collection) meaning that the more the application runs, the slower it gets!

One clap, two clap, three clap, forty?

By clapping more or less, you can signal to us which stories really stand out.