虚拟 DOM 概念随着 react 的诞生而诞生, 由 Facebook 提出, 其卓越的性能很快得到广大开发者的认可; 继 react 之后 vue2.0 也在其核心引入了虚拟 DOM 的概念.
什么是虚拟 DOM?
虚拟 dom 是相对于浏览器所渲染出来的真实 dom 的, 在 react,vue 等技术出现之前, 我们要改变页面展示的内容只能通过遍历查询 dom 树的方式找到需要修改的 dom 然后修改样式行为或者结构, 来达到更新 ui 的目的.
这种方式相当消耗计算资源, 因为每次查询 dom 几乎都需要遍历整颗 dom 树, 如果建立一个与 dom 树对应的虚拟 dom 对象 ( JS 对象), 以对象嵌套的方式来表示 dom 树, 那么每次 dom 的更改就变成了 JS 对象的属性的更改, 这样一来就能查找 JS 对象的属性变化要比查询 dom 树的性能开销小.
vue 和 react 中虚拟 dom 的区别
vue 和 react 中虚拟 DOM(virtual DOM) 是不一样的.
vue 会跟踪每一个组件的依赖关系, 不需要重新渲染整个组件树.
而对于 React 而言, 每当应用的状态被改变时, 全部组件都会重新渲染, 所以 react 中会需要 shouldComponentUpdate 这个生命周期函数方法来进行控制.
更多 web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/vue-js/17217.html