What is the difference between diff in vue and react

Difference: 1. When the node element types are the same but the class names are different, Vue considers them to be different elements and will delete and recreate them, while react considers them to be nodes of the same type and will perform modification operations; 2. List comparison When doing this, Vue compares from both ends to the middle, while React compares from left to right.

The operating environment of this article: Windows 10 system, Vue version 2.9.6, DELL G3 computer.

What is the difference between vue and diff in react

diff algorithm:

A different algorithm for comparing dom (virtual)

Common Points:

vue and diff algorithms do not perform cross-level comparisons, only perform same-level comparisons

Differences:

1. When vue performs diff, call patch The patching function patches the real DOM while comparing. When Vue compares nodes, when the node element types are the same but the class names are different, it is considered to be different elements, deleted and re-created, while React considers them to be nodes of the same type. Modification operation

2. When comparing vue lists, use the method from both ends to the middle. There are two pointers at each end of the old collection and the new collection. They are compared in pairs. After each comparison, the pointers Move to the middle of the queue; react compares from left to right, using the index and lastindex of the element to compare

3. When a collection moves the last node to the front, react will move the previous nodes in sequence Move backward, and Vue will only put the last node at the front. Judging from this operation, Vue's diff performance is higher than react

[Related recommendations: "vue.js Tutorial 》】

The above is the detailed content of What is the difference between diff in vue and react. For more information, please follow other related articles on the PHP Chinese website!