Lately there has been a lot of buzz about React. People are already comparing it to Angular – another very popular framework. In this post I will look at some of the differences between React and Angular.
Comparing React to Angular is not an apples to apples comparison since React only supports a subset of the features offered by Angular. React is primarily a framework for composing UIs through components and doesn't support features like routing and two way binding. Components in React look, on the surface, very similar to directives in Angular. However, there are fundamental differences in terms of how they function internally. Angular encourages clear separation of concerns between object model and view by avoiding tight coupling between them. The object model is applied to the view through declarative data binding, and if done right, a model does not make any assumption about the view. The most common arguments in favor of this template based approach are unit testing and reuse of models.
It's of course hard to make a blanket statement about performance, but many are claiming that the virtual DOM gives React an edge over Angular when it comes to rendering. It's of course a bit harder to ensure single batched updates in Angular since there is a live connection between DOM and tracked properties. However, in theory, a virtual DOM doesn't seem like it couldn't be implemented in Angular in order to achieve some of the same benefits.
Another approach is to create a hybrid application where React serves as the view component in Angular's MVC. I talk some more about that in another blog post.