Now VUE has become the mainstream framework of the front end, using MVVM mode, virtual DOM, DIff algorithm, two-way data binding, providing responsive and componentized view components. Keep your focus on the core library. Small size, good performance, huge ecosystem, development is very good. React, Angular, Riot, Ember, etc. Why do you recommend Vue and what are its advantages over other frameworks? What’s the difference between the more powerful React and him?

vue

Vue benefits:

  1. Vue is easy to learn, simple API, mode embrace the traditional Web, start fast, suitable for rapid development
  2. React JSX, Angular TS, and Angular Watcher slowdowns have all been addressed in vue
  3. Better performance, smaller size
  4. Build tools such as WebPack have default configurations that allow you to focus on your application, but are flexible enough to be configured according to your needs
  5. With an observation system based on dependency tracking and asynchronous queue updates, all data changes are triggered independently unless there is an explicit dependency between them
  6. Component instructions, life cycles, data flows are clearer
  7. Build responses on ordinary JS objects to provide automated computed properties

Compared with the React

  • When a component state changes, re-render the entire component subtree with that component as the root (vUE automatically tracks)
  • CSS is also in JSX, and the template form of Vue is more natural to read and write than JSX, improving development efficiency because you are more familiar with traditional Web writing. In addition, the function of vue’s V-on modifier like React requires a lot of code to implement
  • React learning is steeper. Vue’s routing library and state management library are maintained by the official support and updated simultaneously with the core library, while React is maintained by the community. The ecosystem is relatively scattered, but React’s ecosystem is more prosperous.

And presents the js

  • Complexity: VUE is simpler in TERMS of API and design and can be quickly learned and put into development
  • Flexibility and modularity: Vue has Vuecli to build quickly. Configure the default, you don’t have to spend too much time on configuration, you can focus on the application itself. It also provides the flexibility to adjust each tool configuration based on actual requirements,
  • Data binding: Vue enforces one-way data flows across different components, which makes data flows easier to understand
  • Commands and components: VUE commands and components are clearer

Compared with Polymer

  • Polyfills by weight class is needed, performance degrades
  • The browser itself does not support these features
  • Computed methods are inflexible

Compared with Rnockout

  • Vue only supports IE9 (but it can support IE6)
  • The system is slow and somewhat old, and lacks a complete lifecycle event approach
  • Different interface design concepts

Compare that to Ember

  • Vue creates responses on ordinary JS objects to provide automatically computed properties (whereas Ember manually declares dependencies for computed properties on Ember objects)
  • Vue template syntax can use full-featured JS expressions (whereas Handlebars syntax and helper functions are limited)
  • Vue performs much better than Ember, with automatic batch updates (whereas Ember requires manual management)

Compared with Riot

  • Vue performs better (Riot uses DOM tree traversal)
  • Vue has more mature tool support like Webpack (Riot is built by the community)

In plain English:

Compare vUE to other frameworks

  1. React: Steep learning curve for scale, manual implementation for performance to avoid rendering unnecessary sub-components, JSX for HTML is not as fast as traditional HTML,CSS is faster to get started, and even now CSS is in JSX. Not friendly to newcomers or people who want to develop a project quickly and have to learn JSX, or migrate an original project to a new library. In addition, v-ON and other instructions in VUE need a lot of code to implement in React. React is cross-platform, but Vue now works with Weex as well. Vue also supports JSX rapid build projects and other React features.
  2. Angular1: Complex API, not as flexible as VUE, directive components are not clearly divided, and performance gets worse with Watcher
  3. Angular2: It costs a lot to learn, you have to use TS, it’s bigger than VUE, you don’t need it for small and medium projects, you can’t develop projects quickly, you have to learn it first
  4. Rnockout is slow to take off
  5. Ember requires manual
  6. The Riot build tool doesn’t work
  7. Polymer requires additional tools and is not flexible in computed methods

Below is a detailed description of each framework

A, the React

1. Runtime performance

In Vue, component dependencies are automatically tracked during rendering, so the system knows exactly which component needs to be rerendered, while React needs to implement shouldComponentUpdate manually for unnecessarily rerendered child components

2. HTML&&css

CSS is also handled in JSX, not every developer likes it, vUE also supports JSX, migration vUE is more consistent with the traditional way of writing, so that newcomers can participate more quickly

Size 3.

React learning is steeper. Vue’s routing library and state management library are maintained by the official support and updated simultaneously with the core library, while React is maintained by the community. The ecosystem is relatively scattered, but React’s ecosystem is more prosperous. React create-react app has some limitations

4. Native rendering

React Native can be developed across multiple platforms simultaneously. Vue is working with Weex, but not as mature as Weex

5. MobX

Mbox plus React month is Vue

6. Preact and other React libraries

React libraries tend to share apis and ecologies with React as much as possible. But the ecology is smaller. Because these libraries are not 100% compatible with all of the React ecosystem, some tools and helper libraries may also be unavailable. Or even if it seems to work, incompatibilities can happen at any time, unless the React library you’re using is officially strictly aligned with React.

AngularJS (Angular1)

The JS framework was created in 2009 and later acquired by Google. Core functions: MVC, modularization, automated two-way data binding, semantic tags, dependency injection, etc. Published as a JS file that can be added to web pages with script tags, vue was the inspiration for early development

1. Directives and components

Everything is done by instructions, and a component is a special kind of instruction. In VUE, directives encapsulate ONLY DOM operations, while components represent a self-contained unit

2. The flexibility

Angular has to follow specified rules and is inflexible

Complexity of 3.

The API and design are a bit more complex than VUE

4. Runtime performance

The more Watcher there is, the slower it is, because all watches have to be recalculated for every change in scope. And if some Watcher triggers another update, the dirty check loop may run multiple times, using esoteric techniques to solve the problem of the dirty check loop, sometimes there is no easy way to optimize the scope with a large number of Watcher

Angular (Angular2)

1.TS

You have to develop in TypeScript, and in small to medium sized projects, TS is not what everyone wants to use. Vue can be used or not

2. Runtime performance

Performance is fast at run time

Volume 3.

Although the size has been reduced by tree-shanking and AOT, it is still larger than vue

4. Flexibility

Vue more flexible

5. Learning curve

The learning curve is steep, the API is large, and many concepts need to be understood to work effectively. The design is aimed at large and complex applications, but this is very unfriendly to inexperienced developers

Here are some niche frameworks

Four, Polymer. Js:

Google released a new webUI framework in 2013. Similar to VUE, one of the inspirations for VUE

Disadvantages - poor implementation of computed methods - heavy polyfills are required to work on top of the Web Components standard, and performance degrades - browsers don't support these features, Vue supports IE9 without relying on polyfills to workCopy the code

Five, the Knockout. Js

Microsoft published the pioneer in the field of MVVM models, compatible with IE6, core features: attribute monitoring and dependency tracking, declarative binding, template mechanism

Disadvantages: - Slow development - lack of complete life cycle eventsCopy the code

Six, Riot. Js

MVP(Model-View-Presentation) open source client framework, characterized by small size, less than 1KB, but can build large-scale Web applications, is currently in Version 3.8, has stabilized, can be used in production environments

Cons: - There's very little domestic data, so it's better for more customized projects - micro scenarios are better for Riot, don't need too much external dependency, and need the capabilities of modern frameworks like componentization and data-driven - there aren't many good Riot build toolsCopy the code

Seven, Ember. Js

Ember-cli is an open source JS client framework with MVC pattern, released in December 2011, owned by community developers, documentation is very friendly, ember-CLI fast build, provides a large number of conventions, as long as follow the convention, become very efficient

Cons: - Expensive to learn and not flexible - slow page rendering - bulky frameCopy the code