本文为一个简单的笔记。详情可参见参考资料里的两篇文章，互相填补，结合起来看很不错。
为什么需要虚拟 DOM
- 前端性能优化的一个秘诀就是尽可能少地操作 DOM，因为操作 DOM 相对较慢，还会触发浏览器的重排和重绘。因此需要一层抽象，尽可能将所有更改一次性更新到 DOM 上，保证 DOM 不会出现性能很差的情况。
- 方便通过数据驱动 DOM，不需要手动做 DOM 操作。
- 可以跨平台。比如 SSR，服务端不存在真实 DOM，在服务端执行过程中都是操作虚拟 DOM，最后一步不是 commit 到页面上，而是变成字符串输出。SSR 脉络梳理
from 你对虚拟DOM原理的理解?
对比时，Vue 从左右两端开始，一直到中间有剩余。Old 无剩余 New 有剩余，则新增。Old 有剩余 New 无剩余，则删除。
Old New 都有剩余，则对比。Old 建立 map，key 为节点，value 为 Old 节点下标。遍历 New，如果 New 在 Old 中无，则标记新增。如果 Old 在 new 中无，则标记删除。
（React 因为 fiber tree 是单向链表，只能从左向右原地复用。）
剩下需要移动的，Vue 和 React 不同。
Vue 会做一个最长子序列的计算，然后保持最长子序列不动，移动其他节点。
React 则是仅右移，比较新旧位置，无视新节点需要左移的情况，仅处理新节点需要右移。