袁勤 发表于 3 天前

[vue3] patchFlags与位运算

Vue3在编译template的过程中会分析模板中的动态部分和静态部分,并标记相应的flag,用于在运行时优化虚拟DOM的更新。

[*]Parse:将模板字符串解析成AST;
[*]Transform:对AST进行转换和优化,包括识别动态节点和静态节点;
[*]CodeGeneration:将转换后的AST生成渲染函数,这个阶段会生成patchFlags。
在diff过程中,遇到包含dynamicChildren的块时,diff算法会进入优化模式,跳过对静态节点的处理从而优化了diff的执行效率。
flag的种类

源码位置:core/packages/shared/src/patchFlags.ts at main · vuejs/core (github.com)
export enum PatchFlags {TEXT = 1,CLASS = 1
页: [1]
查看完整版本: [vue3] patchFlags与位运算