被问到虚拟 DOM 时，很多人会直接开始背 diff 算法，但如果主线没讲清楚，答案还是容易散。更稳的方式是先把它从模板到真实更新的完整流程讲出来。
第一步是把模板变成可执行描述
框架会先把模板或 JSX 转成 render 逻辑，目标不是直接操作页面，而是先得到一份对界面的结构化描述。
第二步生成虚拟节点树
执行渲染函数后，会得到一棵描述当前界面的虚拟树。它是内存里的中间结果，便于后续比较和批量更新。
第三步比较新旧差异
状态变化后，框架会重新生成新的虚拟树，再和旧树做差异比较。这里的重点不是“完全不操作 DOM”，而是尽量减少不必要的真实更新。
第四步把必要变更提交到真实页面
最终只有需要变化的部分才会落到真实 DOM。这样做的价值，在于把多次状态变化整理成相对可控的更新过程。
结论
讲虚拟 DOM 时，先抓模板编译、生成虚拟树、比较差异和提交更新这四步，基本就能把核心流程说清楚。
正文完
