弱小的笔记分享，欢迎批评指正👏 ；）
- 是一个javascript对象
- 对象的结构与dom树结构有映射关系
React里的虚拟dom
在React v16之后，React里的虚拟dom指的是Fiber树。
这棵树上包含（不仅仅）了渲染成一个dom树的全部信息，ReactDOM.render()根据fiber树渲染出浏览器可以渲染解析的dom结构。
虚拟dom的优点
-
能够抹平“渲染层”的差异
- 浏览器
- 原生app
- 接入测试框架
- svg...
-
性能好（并不是绝对的）：维护两颗虚拟dom，可以进行比较，将产生的差异结果进行更新 → 避免了过程中多次的重排、重绘
-
操作dom的代价，比操作js对象更昂贵
-
关注点分离，让开发者可以聚焦在逻辑上，而非复杂冗余的dom操作
虚拟dom的缺点
-
存储这样层级深、且复杂的对象，会占用一定的内存空间，影响js的性能
-
更新内容足够小的时候，也需要去遍历整颗虚拟dom树，因为我们需要建立一颗新的树，去替换旧的树
-
React中的虚拟dom使用diff算法，diff算法在有些情况下会变得“蠢”：
-
abcd → dabc ：
- d的位置保持不变
- 将a后移
- 将b后移
- 将c后移
（而直观来说，原本只需要将d移到最前面就好了🤷♀️）
-
