对vue diff算法和原生操作dom哪个性能高有些疑问
小白个人理解,感觉使用原生js操作dom能减少dom的操作啊,使用diff算法,反而有更多的操作,但是网上很多人都说diff能提高对dom操作的性能,不太理解,还请指教
4 回复
如果整个页面开发也就这么点东西,原生DOM 操作确实比虚拟 DOM 快。 另外,也没有任何人说框架操作比原生操作来的快,包括各大框架团队。
操作dom的开销比操作纯JS对象要大很多,所以才会有虚拟dom这个东西。 虚拟dom其实就是一个抽象dom树,用纯javascript来表示。纯javascript的操作是很快的,相对于dom操作而言 对vdom diff后可以知道哪些部分发生了变化,将这次变化统一一次性提交给dom,减少了dom操作,就提高了性能
举个例子,假设你有一个列表有1000个数据要插 传统的方法是操作循环操作dom1000次 而用虚拟dom,对比出和树有1000个不同,就一次性把这1000个元素直接插入dom 尤其是页面大的情况,你每插一次,页面都要进行生产元素,渲染,位置变换等一系列计算,相当损耗性能 所以在这个情况下有一定的性能提升
有个东西叫增量更新。