0%

虚拟DOM

虚拟DOM

1)虚拟Dom是什么?

Virtual Dom 是一种编程理念,将 UI 节点抽象成 JS 对象虚拟地保存在内存中,并且通过某些库(如 ReactDom)渲染成真实的 Dom。

2)虚拟Dom的快表现在哪些方面?

  • Virtual Dom 不会进行排版与重绘操作;
  • Virtual Dom 进行频繁修改,然后一次性比较并修改真实 Dom 中需要改的部分,最后并在真实 Dom 中进行排版与重绘,减少过多 Dom 节点排版与重绘损耗
  • Virtual Dom 有效降低大面积(真实 Dom 节点)的重绘与排版,因为最终与真实 Dom 比较差异,可以只渲染局部

3)React组件的渲染流程是什么?

React 通过 render 方法渲染 Virtual Dom,从而绘制出真实 Dom。每次改变 state 的值就会执行 render 方法。
每次 render 都会产生一份新的 ‘react dom’, Virtual Dom 要对新旧 ‘react dom‘ 进行比较,从而确定在旧的 ‘dom‘ 的基础上进行多少变更。react 的 diff 算法会确定最优的变更策略之后调用 Dom API 更新 UI。

#开发笔记/React