Front end framework Vue, react, angular differences

Time:2021-8-1

At present, the three main front-end frameworks are Vue, react and angular.

Vue
It is a library for building data-driven web interfaces, not exactly a framework for building intuitive, fast and component-based interactive interfaces   MVVM   Frame.
It has the following features: 1. Lightweight framework, 2. Bidirectional data binding, 3. Instructions, 4. Plug-in
advantage:

  1. Simple: the official document is very clear and easier to learn than angular.
  2. Fast: update DOM in asynchronous batch mode.
  3. Composition: combine your applications with decoupled, reusable components.
  4. Friendly to third parties: it is convenient to introduce third-party JS.

Disadvantages: what I want to say is that vue.js is great. Like any other framework / library, it has few disadvantages in itself. I still list the few disadvantages of vue.js I know:
1. The main code is written by you Yuxi. The community is small and needs to be mature; 2. IE8 is not supported; 3. Compared with the other two frameworks, the impact is small and the richness is not enough.

REACT
React originated from Facebook’s internal project to build instagram’s website, and was open source in May 2013. React has high performance and simple code logic. More and more people have begun to pay attention to and use it. It has the following features:

1. Declarative design: react adopts declarative paradigm, which can easily describe applications.
2. High efficiency: react minimizes interaction with DOM by simulating dom.
3. Flexibility: react can work well with known libraries or frameworks.

advantage:

  1. Fast speed: during UI rendering, react updates the actual DOM locally through micro operation in the virtual dom.
  2. Cross browser compatibility: virtual DOM helps us solve the cross browser problem. It provides us with a standardized API, which is even OK in IE8.
  3. Modularity: write independent modular UI components for your program, so that when one or some components have problems, they can be easily isolated.
  4. Unidirectional data flow: flux is an architecture for creating unidirectional data layer in JavaScript applications. It was conceptualized by Facebook with the development of react view library.
  5. Isomorphic and pure javascript: because search engine crawlers rely on server-side response rather than JavaScript execution, pre rendering your application helps search engine optimization.
    6. Good compatibility: for example, requirejs is used to load and package, while browserify and webpack are suitable for building large-scale applications. They make difficult tasks less daunting.

Disadvantages:
React itself is only a V, not a complete framework, so if a large project wants a complete framework, it basically needs to add reactrouter and flux to write large applications.

Angular
Angular is an excellent front-end JS framework, which has been used in many Google products.
It has the following features: 1. Good application structure, 2. Two-way data binding, 3. Instructions, 4. HTML template, 5. Embeddability, injection and testing
advantage:

  1. The template has powerful functions and comes with extremely rich angular instructions.
  2. It is a relatively complete front-end framework, including services, templates, two-way data binding, modularization, routing, filters, dependency injection and other functions;
  3. User defined instructions can be used multiple times in a project.
  4. Ng modularity boldly introduces some things of Java (dependency injection), and can easily write reusable code, which is very helpful for agile development teams.
  5. Angularjs is developed by Internet giant Google, which also means that it has a solid foundation and community support.

Disadvantages:

  1. It’s easy to get started, but there are many concepts after going deep, which is difficult to understand in learning
  2. There are very few document examples. The official documents basically only write the API, and there is no example. Many times, the specific use is from Google, or directly ask the author of Misko and angular
  3. It’s not particularly good for IE6 / 7 compatibility, but you can use jQuery’s own handwritten code to solve some problems
  4. There are few best practice tutorials on the application of instructions. Angular is actually very flexible. If you don’t look at some authors’ use principles, it’s easy to write four different codes. For example, JS still has a lot of DOM operations like jQuery
  5. Di dependency injection displays declarations if code compression is required

Personally, Vue is very suitable for the project development of small enterprises or school laboratories because of its low learning cost. React is the most flexible and more controllable. Angular is based on typescript. Therefore, it is not as convenient as Vue when quoting third-party plug-ins. When selecting a framework:

If you prefer flexibility over other features, use react.
If you prefer encoding in typescript, select angular.
If you’re a JavaScript enthusiast, use react because it’s all about JavaScript.
If you prefer clean code, use Vue in your application.
Vue provides the simplest learning curve and is an ideal choice for beginners.
If you want to separate concerns in your application, use Vue.
If you like object-oriented programming, angular is definitely your choice.
Vue is ideal for small teams and small projects. If your application seems large and has important future expansion plans, choose react or angular.