What is Angular 2?
Angular 2 is a framework that makes it easy to build applications with the web, supported by Google. It is is often referred as a MVC framework. Angular 2 combines declarative templates, dependency injection, end to end tooling, and integrated best practices to solve development challenges. Angular 2 empowers developers to build applications that live on the web, mobile, or the desktop.
How Angular 2 works. Let see angular architecture:
What is React?
As React is just a library it does not provide any architecture itself. Most used architectures are Flux and Redux. How React works:
What do Google Trends tell us?
But what about the job trends?
We can see that Angular is a winner in the 2 categories.
Community is the prime factor to consider while selecting a framework. A large community means more questions answered, more third-party modules, more YouTube tutorials.
Angular 2: Angular 1 is definitely the most popular with largest number of community members. Also, it has the highest number of StackOverflow questions.
While the AngularJS 1 community is very large, the Angular 2 community is just gaining ground.Angular 2 is just over 25k stars on Github. There are ~15 000 repositories on Github that contain "Angular 2" or "ng2" and are written in TypeScript
React: There’s a quickly growing community, but it isn't big enough to provide all solutions. Also the community is young, so it’s possible you’ll have to do a lot of “reinventing of the wheel” in order to get the specific features you’re looking for.
React is over 69K stars on Github. There are 95, 500 repositories containing the word "react" in them, roughly over nine times more than what Angular 2 has. Still, one of the big reasons for the large number of repositories is that React comes with just a few built-in functionalities and relies on its community to provide it with the needed tooling to develop full-scale applications.
So many people think that tech selections should be all about performance. In the performance battle between Angular 1 and React, React won easily due to Angular 1 dirty checking and digest cycles. But Angular 2 has cleaned up its act. It’s fast, thanks to its highly sophisticated change detection mechanisms.
Angular 2 doesn't do deep object comparison. If items are added/removed to/from an array, change detection won't detect it. The same for object properties as long as they are not directly bound from the view.
React is based on concept of diffing the DOM of the new state with the previous state, using Virtual DOM and only render the difference. Manipulating the DOM is slow. Manipulating the virtual DOM is much faster, because nothing gets drawn onscreen.
There’s not much of a difference between React and ng2, both are performance-wise.
|Code Design||JS into HTML||JS centric|
|DOM||Regular DOM||Virtual DOM|
|MVC||Yes||View layer only|
|3rd party library compatibility||High||High|
|Cross-platform||Ionic 2/ NativeScript||React Native|
Stuff in Angular 2 You Won’t Find in React:
- TypeScript - The biggest selling point of TypeScript is tooling. It provides advanced autocompletion, navigation, and refactoring. Angular 2 with typescript generally has better IDE support. There is a bunch of hints and error messages flow in the Microsoft Visual Studio Code.
- Dependency Injection - Angular has its own dependency injection framework, and you really can't build an Angular application without it. DI is a coding pattern in which a class receives its dependencies from external sources rather than creating them itself. For comparison React has not any concept of a DI. That is, instead of having a container that knows how to create objects and passing in dependencies, you pass them explicitly by passing props to the component when you instantiate it.
- AOT compilation - Angular 2 + RxJS is pretty huge. Almost 800k minified. That’s about 4 times larger than React + Redux. But ng2 has the ability to do Ahead Of Time compiling (AOT) and tree-shaking. With a correctly configured production build, you can reduce the bundle size dramatically using only the features actually used in your app, which give the final bundle a much smaller footprint.
Stuff in React You Won’t Find in Angular 2:
Here is a useful list to help you make the decision:
*I’ll sometimes abbreviate Angular 2 “ng2” — a common practice in the community.