Comparison AngularJS, ReactJS, and Vue.JS

1. Overview

	Angular	React	Vue
Backed by	Google	Facebook	Community
Prevalent Architecture	MVC	Flux	FLux
Architecture flexibility	No	Yes	Yes
CLI	angular-cli	No official CLI, but create-react-app is used	Vue-cli
Documentation	Simple	somehow limited	Adequate
Code Reusability	Yes	No, only CSS	Yes, CSS and HTML
Main feature	Mature framework with Modularity	The Node Tree, Virtual DOM	The kind of amalgamation between Angular and ReactJS
Well-known usages	Google, Forbes, weather.com, etc.	PayPal, Uber, Netflix, etc.	Expedia, Alibaba, Nintendo, etc.
Strengths	Intuitive and Comprehensive nature Modularity Ease of using components Ease of utilizing Dependency Injection Several out of the box capabilities such as Form Validation and HttpClient Unit Testing Ready Framework	Flexibility to interact with different libraries without any issue Multifaceted library and plenty of tools such as Blueprint, Material-UI, React-Bootstrap, React Toolbox and React Native Web Code Flexibility	Very small size Separation of Javascript code, templates, and CSS code Simple Integration

2. Pros and Cons

2.1 Angular

2.1.1 Pros

• Angular’s created to be used alongside with Typescript. And has exceptional support for it.
• Angular-language-service — which allows intelligence and autocomplete inside of component external HTML template files.
• New features like a generation of Angular based npm libraries from CLI, generation, and development of WebComponents based on Angular.
• Detailed documentation that allows getting the all necessary information for the individual developer without asking his colleagues. However, this requires more time for education.
• One-way data binding that enables singular behaviour for the app which minimized risks of possible errors.
• MVVM (Model-View-ViewModel) that allows developers to work separately on the same app section using the same set of data.
• Dependency injection of the features related to the components with modules and modularity in general.
• Structure and architecture specifically created for great project scalability

2.1.2 Cons

• Variety of different structures(Injectables, Components, Pipes, Modules etc.) makes it a bit harder to learn in comparison with React and Vue.js, which have an only “Component” in mind.
• Relatively slower performance, according to different benchmarks. On the other hand, it can be easily tackled by utilizing so-called “ChangeDetectionStrategy”, which helps to control the rendering process of components manually.

2.2 React

2.2.1 Pros

• Easy to learn, thanks to its simple design, use of JSX (an HTML-like syntax) for templating, and highly detailed documentation.
• Developers spend more time writing modern JavaScript, and less time worrying about the framework-specific code.
• Extremely fast, courtesy of React’s Virtual DOM implementation and various rendering optimizations.
• Great support for server-side rendering, making it a powerful framework for content-focused applications.
• First-class Progressive Web App (PWA) support, thanks to the `create-react-app` application generator.
• Data-binding is one-way, meaning less unwanted side effects.
• Redux, the most popular framework for managing application state in React, is easy to learn and master.
• React implements Functional Programming (FP) concepts, creating easy-to-test and highly reusable code.
• Applications can be made type-safe with either Microsoft’s TypeScript or Facebook’s Flow, with both featuring native support for JSX.
• Migrating between versions is generally very easy, with Facebook providing “codemods” to automate much of the process.
• Skills learned in React can be applied (often directly) to React Native development.

2.2.2 Cons

• React is unopinionated and leaves developers to make choices about the best way to develop. This can be tackled by strong project leadership and good processes.
• The community is divided on the best way to write CSS in React, split between traditional stylesheets (CSS Modules) and CSS-in-JS (i.e. Emotion and Styled Components).
• React is moving away from class-based components, which may be a barrier for developers more comfortable with Object Oriented Programming (OOP).
• Mixing templating with logic (JSX) can be confusing for some developers at first.

2.3 Vue

2.3.1 Pros

• Empowered HTML. This means that Vue.js has many similar characteristics with Angular and this can help to optimize HTML blocks handling with the use of different components.
• Detailed documentation. Vue.js has very circumstantial documentation which can fasten learning curve for developers and save a lot of time to develop an app using only the basic knowledge of HTML and JavaScript.
• Adaptability. It provides a rapid switching period from other frameworks to Vue.js because of the similarity with Angular and React in terms of design and architecture.
• Awesome integration. Vue.js can be used for both building single-page applications and more difficult web interfaces of apps. The main thing is that smaller interactive parts can be easily integrated into the existing infrastructure with no negative effect on the entire system.
• Large scaling. Vue.js can help to develop pretty large reusable templates that can be made with no extra time allocated for that according to its simple structure.
• Tiny size. Vue.js can weight around 20KB keeping its speed and flexibility that allows reaching much better performance in comparison to other frameworks.

2.3.2 Cons

• Lack of resources. Vue.js still has a pretty small market share in comparison with React or Angular, which means that knowledge sharing in this framework is still in the beginning phase.
• Risk of over flexibility. Sometimes, Vue.js might have issues while integrating into huge projects and there is still no experience with possible solutions, but they will definitely come soon.

3. Lifecycle

3.1 Angular

3.2 React

3.3 Vue

4. Reference

https://www.codeinwp.com/blog/angular-vs-vue-vs-react/

https://medium.com/@AzilenTech/angularjs-v-s-vue-js-v-s-reactjs-choose-the-best-in-2018-66647bab1a65

https://medium.com/@TechMagic/reactjs-vs-angular5-vs-vue-js-what-to-choose-in-2018-b91e028fa91d

https://blog.hellojs.org/differences-between-angularjs-vuejs-and-reactjs-5d80203dfd16