DEV Community

Roberto Ruiz
Roberto Ruiz

Posted on • Edited on

Angular vs. React: Past and present

Angular recently rolled out the 9th version. We will take the time to travel to understand why Web Development has reached a crossroads (again).


Near ten years ago, we seek a duel with three characters:

  • PHP, as "The usual, and works". But, PHP code and HTML placed in the same file.
  • HTML, reinventing itself (later would come HTML5), with jQuery as addon.
  • Flash, searching a perspective change delegating responsibility to a client (navigator). It was no mistake.

All was fully image composed. And we downloaded steadily.

Until then, the programmer should optimize the site to prevent server overhead when users enter, often practices in a cache. Be confronted with the web ten years ago to the infrastructure level, has sent us to change web rethink.

Adobe worked in a Macromedia inherited technology not recognized for the community (in those days): Rich Internet Application (RIA). This concept impulsed the multi-platform application development at low-cost in this decade, because the navigator is the protagonist (that stores all content).

While one of the most spoken was Flash, also Java by Sun Microsystems (before Oracle bought) and Silverlight by Microsoft. Nevertheless, we had to download and install each addon to navigate in that site (and only worked in computers).

After a time, the release of SPA frameworks (Single-Page Application) resulted in a migration of these RIA apps to this because not addons required for the navigator (only HTML5 support).

It has not resolved yet?

Over the decade, JavaScript achieves bigfoots, at a point to create APIs. The SPAs were not indifferent to this.

What looked like a paradigm change in JavaScript use, rolled out a discussion where cannot take conclusions yet.

Architecture and frameworks

In the beginning, the election oriented to make migration less traumatic. Therefore, it is normal to listen to concepts also MVVM (where we could choose knockout.js) and MVC (with AngularJS) in each SPA.

Even though I mean about MVC, AngularJS was sold as MVW. ("W" of "whatever"). But, we use this framework as MVC.

Nevertheless, given that JavaScript originally is a functional-oriented programming language, saw the need to work with an object-oriented schema (similar to a backend, with classes instead of prototypes). In the beginning, ECMAscript makes its work and the golden-brooch was given by TypeScript, with Microsoft support.

From these findings, Google (what supports AngularJS) implements Angular (MVC) since versión 2+ in TypeScript. Also surge new SPAs as React (created by Facebook, PHP fundamentalist) and Vue.js (MVVM) replaces knockout.js a lot.

Angular

Most chosen in the big companies.

Advantages:

  • Optimized to prevent scalability issues.
  • Collaborative development.
  • With TypeScript gain consistency.
  • Use Web Components standard.
  • Dependency Injection support.
  • Bi-directional data binding.

Disadvantages:

  • Hard to learn.

React

Brings features that developers love.

Advantages:

  • Easy to learn.
  • Minimal API.
  • Focus on UI development.
  • Optimized with Virtual DOM.
  • Works in ES6+ and JSX.

Disadvantages:

  • Dependency Injection not supported.
  • Uni-directional data binding.

Trends

In the last five years, Angular was at the top of Google searches, but React reached the 1st place alone in the last year and now still is the SPA framework most wanted.

In Stack Overflow the same context happens: In 2019, React had a more Q&A than Angular. But in 2019 Angular pass the historic number of Q&A what AngularJS reached in 2016.

Conclusions

  1. You do not choose a SPA framework because of community acceptation only.
  2. Determine a framework based on the solution what you need to develop.
  3. If you only know about JavaScript and not TypeScript, maybe React can be your friend.
  4. These were an infrastructure-level discussion ten years ago, but today scales to what has programmed itself (and how).

(Versión en español disponible en Medium)

Top comments (0)