Vue模版编译原理?

轩辕小不懂发布于 2021-12-28 13:59

阅读 602

答案 1

分类：WEB前端开发

Nen 2021-12-28 14:15

- 程序员

ue中的模板template无法被浏览器解析并渲染，因为这不属于浏览器的标准，不是正确的HTML语法，所有需要将template转化成一个JavaScript函数，这样浏览器就可以执行这一个函数并渲染出对应的HTML元素，就可以让视图跑起来了，这一个转化的过程，就成为模板编译。模板编译又分三个阶段，解析parse，优化optimize，生成generate，最终生成可执行函数render。

解析阶段：使用大量的正则表达式对template字符串进行解析，将标签、指令、属性等转化为抽象语法树AST。

优化阶段：遍历AST，找到其中的一些静态节点并进行标记，方便在页面重渲染的时候进行diff比较时，直接跳过这一些静态节点，优化runtime的性能。

生成阶段：将最终的AST转化为render函数字符串。

Vue模版编译原理?

轩辕小不懂的其他提问

类似问题

Vue模版编译原理?

轩辕小不懂 的其他提问

类似问题

轩辕小不懂的其他提问