虚拟DOM和DOM diff

87 阅读1分钟

虚拟DOM: 能代表DOM树的对象,通常含有标签名、标签属性、事件监听和子元素们、以及其他属性

优点:

  • 减少DOM操作:虚拟DOM能将多次DOM操作合并为一次,;虚拟DOM借助DOM diff可以把多余的操作省掉
  • 可以跨平台:它本质上是JS对象,不仅可以变成DOM,还可以变成小程序、ios应用、安卓应用等

缺点:

  • 需要借助额外的创建函数,例如React的createElement、Vue的h函数,但是可以用过JSX来简化为XML写法

DOM diff: 就是一个函数,把新的虚拟DOM树和旧的虚拟DOM树进行对比,然后决定要执行那些DOM操作

缺点: 同级对比的话,有可能出现识别bug,需要用key来帮助识别

优点: 减少DOM操作