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

This article mainly introduces "what is the difference between diff in vue and react". In daily operation, I believe many people have doubts about the difference between diff in vue and react. Xiaobian consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the question of "what is the difference between diff in vue and react?" Next, please follow the editor to study!

Differences: 1. When the node element type is the same and the class name is different, vue thinks it is a different element and will delete and recreate it, while react thinks it is a node of the same type and will modify it; 2. When comparing the list, vue compares from both ends to the middle, while react compares from left to right.

This article operating environment: windows10 system, Vue2.9.6 version, DELL G3 computer.

What's the difference between diff in vue and react?

Diff algorithm:

A different algorithm for different comparison of dom (virtual)

What they have in common:

Both vue and diff algorithms do not make cross-level comparisons, only peer comparisons

Differences:

When 1.vue performs diff, call the patch patch function to patch the real dom while comparing. When vue compares nodes, when the node element type is the same, but the class name is different, it is considered to be a different element, deleted and recreated, while react considers it to be the same type of node to modify the operation.

When comparing 2.vue lists, there are two pointers at both ends of the old set and two pointers at each end of the new set. After each comparison, the pointer moves to the middle of the queue, while react compares from left to right, using the index and lastindex of the element.

3. When a collection moves the last node to the front, react will move the previous node backward in turn, while Vue will only put the last node first. In this way, the diff performance of Vue is higher than that of react.

At this point, the study on "what is the difference between vue and diff in react" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

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.