← 返回首页
Vue3 的虚拟 DOM 做了哪些性能优化？
Vue3 对虚拟 DOM 进行了重写，引入了三大核心编译时优化：
- PatchFlag（补丁标记）：编译时给动态节点打上标记（如 TEXT、CLASS、STYLE），在 Diff 算法运行时，只对比带有标记的节点，跳过大量不必要的属性比较。
- 静态提升（Static Hoisting）：将模板中不随数据变化的纯静态节点提升到渲染函数之外。每次更新时直接复用这些节点，避免重复创建，减少内存开销。
- 树结构扁平化（Tree Flattening）：动态记录包含动态节点的块（Block），在更新时直接跳过块之外的纯静态内容，大幅减少需要遍历的节点数量。