react 里面的 virtual DOM的效率为什么比直接操作DOM更快呢

Question

react里面有virtual DOM这个概念嘛他和原生操作DOM的区别就是用JS生成一个类似中介的虚拟dom这个是用JS实现的DOM，他里面有记录了变化前后的一些记录，然后在重新渲染的时候，进行有区别部分的局部渲染。这样就可以避免整个页面的渲染？那原生操作DOM就是整个页面渲染？我看很多网上的例子都是说什么原生每次变化都是直接重置innerHTML,这样操作如果大量数据的话就会GG,哈？virtual dom是记录变化，然后利用他的diff算法进行优化，最后在有变化的地方进行局部渲染，那么我用原生不能实现同样的效果？我不能也通过对比找出变化然后利用diff算法在指定位置进行innerHTML修改？这样效率会比virtual dom差？求解

Answer 1

我的理解是你可以做到比React快，如果你能做到两点：

1. Avoid unnecessary re-render.

2. Have a better diff algorithm!

具体可以看stackoverflow上virtual dom作者的回答。