Why is Vue.js using VDOM?

Question

According to Vue.js documentation , it uses VDOM under the hood to render the user interface. In my opinion, VDOM was basically invented to avoid “tracked dependencies”. With VDOM, you can reconcile large parts of an application without knowing what exactly has changed. As a result, you can use simple objects and arrays to describe the view, and you just need to tell the structure about the change (for example, setStatein React). Then, both VDOM trees are compared, and the minimum set of necessary changes is applied to the real DOM.

Vue.js, on the other hand, uses tracked dependencies. He knows exactly what has changed, so DOM bindings could be used. In addition, since most Vue.js users already use the template language, this does not actually provide the greater flexibility provided by VDOM. So why did Evan decide to use VDOM?

Answer 1

There are several aspects to this design decision.

• . DOM ( Vue 1.x) , , . , (, ). ( ) , , , . VDOM DOM - VNodes, .

  , VDOM ​​, .

• VDOM diffing - , setState() . React PureComponent shouldComponentUpdate . , , VDOM .

• - . , , . , , . , Vue 2 "" , , .

, , :)