总览：Vue编译的三大步骤
Vue3的模板编译过程可分为三个核心阶段：
- parse（解析），将template（模板字符串）转为AST（抽象语法树）
- transform(转换)，遍历AST，进行优化和标记
- generate（生成），将处理后的AST转为可执行的渲染函数
最终，模板被编译成一个返回虚拟DOM的jsvascript函数。
parse过程详解
- 将模板字符串通过词法分析和语法分析解析成抽象语法书树
- 识别标签、属性、插值、指令等
- 生成的 AST树，每个节点代表一个语法结构
transform转换过程
Vue优化关键阶段，遍历AST应用转换插件，处理v-if、v-for等指令；识别静态节点动态节点；收集需要提升的静态节点、为动态节点打标记、提升静态节点等。
- 静态提升。找到完全静态的节点（如：
<p>hello</p>）。在AST上标记，并生成代码将其提取到渲染函数外部，只创建一次，后直接复用。 - 补丁标志。为动态节点标记其变化类型，运动时diff只检查被标记的部分。
- 树结构拍平。
- 缓存事件处理函数。
generate
使用h函数将transform优化后的AST转换为可执行的渲染函数代码字符串；输出一个返回 VNode 树的 render 函数，通常以字符串形式嵌入到组件的 setup() 或模块中。
