![[嘿哈]](http://lf-web-assets.juejin.cn/obj/juejin-web/xitu_juejin_web/img/jj_emoji_67.9ceed33.png)
获得徽章 8
- 5.22 - Vue源码(8)- 编译器之解析
这部分学习了近 4 天左右，只能利用碎片时间在坚持学习。只能说事太多了。（或者是自己要的目标太多了）
学习自李永宁大佬
juejin.cn + 自己总结下：
1. 编译器解析部分的本质：类 HTML 字符串模版解析成 AST 对象来表示和记录。
2. Vue 的编译器都做了什么：
--（1）将组件的 html 模版解析成 AST 对象。
--（2）优化，遍历 AST，为每个节点做静态标记（后续更新的过程中就可以跳过这些静态节点） => 标记出静态根节点（标记静态根用于生成渲染函数阶段，生成静态根节点的渲染函数）
--（3）从 AST 生成运行时的渲染函数，即大家说的 render，其实还有一个，就是 staticRenderFns 数组，里面存放了所有的静态节点的渲染函数。
3. 编译器的解析过程，怎么将 html 字符串模版变成 AST 对象
-- 遍历 HTML 模版字符串，通过正则表达式匹配 "<"
-- 跳过某些不需要处理的标签，比如：注释标签、条件注释标签、Doctype。
-- 解析开始标签
-- 解析闭合标签
-- 最后遍历完整个 html 模版字符串以后，返回 ast 对象
----- 分割线
思维导图，真的是硬做，就硬做！！太难了这部分！展开12 - 个人主页：juejin.cn
大家好，我是winter，一个前端技术人。
在过去，我做过嵌入式系统的浏览器开发，带过前端团队，也做过前端架构，现在，我是一名前端领域的教育从业者。
我08年毕业参加工作，至今已经十余年，这段时间我见证了前端职位的发展，也亲身参与了移动前端的发展。在这些年里，我从一个写C++的纯粹的嵌入式工程师，逐步转到了前端领域。我认为前端技术是web的开放、互联和标准化的典型体现，前端是我认同的技术方向。
在从事前端教育领域后，我在从事教育的过程中，对自己过去的技术也做了完整的自我总结，所谓温故而知新，在这个过程中，我自己也有很大的提升。
很高兴能参加此次AMA，大家可以跟我交流「前端技术」、「前端架构」、「前端工程」、「前端教学」、「前端团队管理」、「浏览器」等话题，当然了，AMA其实就是问什么都可以啦！
我会在 2021年1月25日-1月29日（共5天）之间，选择其中的问题回答。在活动结束之后，我会选出一个最佳问题（与技术、职场或个人发展相关），该提问者能够获得掘金送出的精美周边。展开10742
juejin.cn