Shulou(Shulou.com)06/03 Report--

This article introduces the knowledge of "rough difference and comparison between Vue and React". In the operation of actual cases, many people will encounter such a dilemma, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

Comparison of rough differences between Vue and React

The benefits of Vue include:

Flexible selection of templates and rendering functions

Simple syntax and project creation

Faster rendering speed and smaller volume

The benefits of React include:

More suitable for large applications and better testability

Suitable for both Web side and native App

More support and tools from a larger ecosystem

similarity

React and Vue have many similarities, React and Vue are excellent frameworks, they have more similarities than differences, and most of their best features are the same: for example, they are both JavaScript's UI frameworks, focusing on creating front-end rich applications. Unlike the early JavaScript framework, Reat and Vue have only the skeleton of the framework, and other functions such as routing and state management are separate components of the framework.

Both are JavaScript libraries for creating UI

Both are fast and portable; both have component-based architectures

All use virtual DOM.

Can be placed in a single HTML file, or become a module in more complex webpack settings

All have separate but commonly used routers and state management libraries

The biggest difference between them is that Vue usually uses HTML template files, while React is entirely JavaScript. Vue has two-way binding syntax sugar.

Differences

Vue components are divided into global registration and local registration, which are all through the import corresponding components in react, and then referenced in the template

Props can be changed dynamically, and sub-components are also updated in real time. In react, it is officially recommended that props should be like a pure function with consistent input and output, and it is not recommended to change the view through props.

A subcomponent typically explicitly calls the props option to declare the data it expects to get. It is not necessary in react, and both of them have props verification mechanism.

Each Vue instance implements an event interface to facilitate communication between parent and child components. There is no need to introduce state management mechanism in small projects, but react must implement it on its own.

Use slots to distribute content so that the contents of the parent component can be mixed with the child component's own template

With more instruction sets, templates can achieve richer functions, while React can only use JSX syntax

Vue adds syntax sugar computed and watch, but in React you need to write a set of logic to implement it.

React's idea is all in js, through js to generate html, so designed jsx, and through js to operate css, community styled-component, jss, etc.; while vue is the combination of html,css,js, with their respective processing methods, vue has a single file component, html, css, js can be written into a file, html provides a template engine to deal with.

React does very little, and many things are left to the community to do. Many things in vue are built-in, which are really convenient to write. For example, combineReducer of redux corresponds to modules of vuex, reselect corresponds to getter of vuex and computed of vue component, mutation of vuex changes raw data directly, while reducer of redux returns a new state, so redux combines immutable to optimize performance, vue does not need.

React is the overall idea is functional, so it advocates pure components, immutable data, one-way data flow, of course, it can also be done where two-way is needed. For example, with redux-form, components are generally split horizontally through high-level components. And vue is data changeable, two-way binding, declarative writing, horizontal split of vue components in many cases using mixin.

This is the end of the content of "rough differences between Vue and React". Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.