Aug 31, 2016

Angular vs React Comparison

Choosing a front-end library we certainly come to a holy war between Angular and React. In fact, both of them were created by professionals and have been used in famous big projects and it would be weird if one was totally the best choice. Sure enough, each of them is good and useful, but they are different. You just need to choose one that fits your way of thinking and your tasks. Let’s go through the major differences between our “competitors” and look at the pros of cons of AngularJS and ReactJS.

State of Angular vs React in 2017 is hard to analyze because React community is solid and grows, while Angular community is migrating from one version to another. Old packages are being deprecated, new packages are not yet stable and there's not a lot of them yet. On the other hand Angular team has created this situation themselves, so it's a fair situation.


Library or framework

The main difference between Reactjs and Angularjs is that React is a library with limited set of features, while Angular is a complete framework.

ReactJS is a small JavaScript library used for rendering user interfaces. It has quite short documentation that can be reviewed just once to become familiar with the library. React builds views quite fast and doesn’t declare any requirements to model or controller – you can use any routing and ajax systems or don’t use them at all. The disadvantage of broad choice of additional libraries is the choice itself. Even if you just need to build an ajax request you need to choose a library first. Upon that if you have distributed development team, you colleagues definitely will choose different solutions and then will dispute and re-code, you bet!

In the meantime Angular is a complete framework with documentation as clear as mud, and you have to spend time to learn its terminology. To code something with Angular you have to read about its components, directives, controls, learn typescript, template design, etc. But there’s complete manual in documentation, step by step guides how to do routing, server requests, etc. Yes, it takes time to learn Angular and it will be quite complicated to replace framework parts you don’t like with more fitting tools, but first you have to explore original framework with all its stock components and documentation to see its functionality and applicability in your work.

Tracking changes or View rebuilding

Angular has two-way data binding so it tracks data changes and determinates what exactly should be updated in HTML. This is cool feature but it requires a handler for each element which should be updated. Whereas React just rebuilds complete DOM in memory and then compares it to current one to figure out what changes need to be made in it.

Please note, in Angular 1.x it was much easier to make your app slow by chance. For example when using ”$watch” and “ng-repeat” without “track by” and in some other cases.

Simple code or autocompiling

Angular tracks data changes and automatically updates liked view components or even interface at all. This causes a WOW effect and allows to write less of code. React requires from developer to code specified methods for user actions processing and data updating. Here we have a dilemma – develop a lot of code which is clear and understandable or write less code which behavior is not always clear.


Let’s look at the difference between ReactJS and AngularJS when it comes to the render. React uses JSX - JS with some HTML syntax inside. Angular in its turn offers to use HTML templates but add some JS inside using directives.

On the one hand it’s convenient to store layout next to logic and just add angle brackets in your JS code. On the other hand it’s good to have layout and logic separated from each other, so HTML developer can work with HTML as they used to instead of designing in JS. Just look at an example of coding same reusable element and choose your winner:


var createItem = function(itemText) {
  return {itemText};
return {};


  <li ng-repeat="item in items">{{item}}</li>


Debugging part is worth to be described comparing ReactJS and Angular JS. Let’s take a look on errors handling. When you made a typo in JSX while building your app with React, it will not be compiled. JSX compiler catches the error, stops the compilation and shows you the error line. You can quickly figure out what’s the problem. This feature makes development faster. For debugging in Angular you can use external tools like Batarang, but clear original Angular will not tell you anything about errors (f.e like incorrect reference to variable) while compilation, instead it will get you app/website down while running. It should be noted that Angular team has implemented compilation-stage error-handling feature in Angular 2. So there’s no evident winner in this question if we compare last versions of products.

Stability and new release.

Angular team has almost released second version of the framework where downward compatibility is not supported and will not be. It definitely will cost you much time to rebuild existing projects from Angular 1 to Angular 2. Whole ecosystem of apps and libraries has to be coded again. In the meantime React got new major version, more stable API and keep getting new tools.

Moving to new version is a big issue and especially if we move to complete new framework and language. So Angular loses this battle, until at least stable AgularJS 2 version will be released and maintained. But we should keep in mind that this new Angular is designed and developed with paying big attention to current projects and their problems and aimed to fix weaknesses of the first version. Besides that, we are talking about new framework with set of various tools and all of them are upgraded.

Although React is stable itself, its ecosystem is far from this – new Flux implementations come every week. It’s still not clear what tool to use for next projects. We will be able to say more confidently after Angular 2 gets stable release and even an update, so it will be possible to compare moving apps to new version with latest React and Angular 2.

React vs Angular performance

Angular 1.x had issues and React was way faster. Angular 2.x was cleaned up and introduced ahead of time rendering (AoT), now raw benchmark numbers are very similar. There's no point in picking one over another for performance - now it's all about application architecture.

React vs Angular popularity

React is clearly winning at the time of writing this article. Angular's community is split between first and second version, both of which are less popular that React.

As Angular 2 adoption progresses, community will quickly grow as well. But React doesn't have this problem at all and will just continue growing as before.

Our choice

Our company also had to choose between ReactJS and AngularJS to become a standard tool for our business. We work in a distributed development team, usually in different time zones, with different responsibilities – some work with scripts, others design HTML/CSS, etc. It is very important for us to have standard structure and preferred solutions in our projects, so every team member could work separately but create unified code. Due this we chose Angular.

Server side renderingSupportedSupported
MobileNativeScript, IonicReactNative
JavaScript fatigueLess fatigueMore fatigue
Learning curveHighLow
Github stars22.7k63.4k

Our team has already created quite big and complicated applications using Angular 1.x and now we are running a project with use of Angular 2.

Subscribe for the news and updates

More thoughts
Apr 15, 2024Technology
Lazy Promises in Node.js

Promise is a powerful tool in asynchronous programming that allows developers to call a time-consuming function and proceed with program execution without waiting for the function result.

Jul 27, 2022Technology
Forge Viewer: Our Experience with an Unusual Project

Once we received an interesting task from a client. They needed to allow their users to upload a 3D model of the building and show it in a timelapse video from the construction site.

Jun 14, 2017Technology
How to Deploy a Django Application on Heroku?

In this article I'll show you how to deploy Django with Celery and Postgres to Heroku.

Feb 28, 2017Technology
How to write an API in Django

There is such a term as Remote Procedure Call (RPC). In other words, by using this technology, programs can call functions on remote computers. There are many ways to implement RPC.

Mar 6, 2010TechnologyManagement
Supplementing settings in settings_local

For local project settings, I use old trick with settings_local file:try:from settings_local import \*except ImportError:passSo in we can override variables from I didn't know how to supplement them. For example how to add line to INSTALLED_APPS without copying whole list.Yesterday I finally understood that I can import settings from settings_local:# settings_local.pyfrom settings import \*INSTALLED_APPS += (# ...)

Feb 28, 2010Technology
Composing multiple views in Django

In UNIX way, each view should solve single task. This is good idea, but sometimes we need to mix logic of different views on same page. Filter, sort, paginate, or, for example, add comment on product page. In this article I'll show how we can mix such multiple views.