在vue中创建HTML
- 模板
- 手写渲染函数(最原始的方法）
- jsx
渲染过程
模板->模板编译->渲染函数->vnode->用户界面
模板编译成渲染函数
- 将模板解析为AST
- 遍历AST标记静态节点
- 使用AST生成渲染函数 在模板编译中的相应模块为
解析器
- 将模板解析成AST
- 主线将HTML解析器（开始标签钩子函数结束标签钩子函数、文本钩子函数以及注释钩子函数）、文本解析器、过滤器解析器组装在一起
- 主线上做的事是监听HTML解析器。触发钩子函数时就生成一个对应的AST节点。 AST就是用js中的对象来描述一个节点，一个对象表示一个节点。很多独立的节点通过parent属性和children属性连在一起时，就变成了一个树。
优化器
- 遍历AST，检测出所有的静态子树（永远不会发生变化的DOM节点）并打上标记
代码生成器
- 将AST转换成渲染函数中的内容（代码字符串）
- 导出到外界使用时，会将代码字符串放到函数里，这个函数叫渲染函数，渲染函数的作用是生成vnode。
let code=`with(this){return 'hello'}`
let hello=new Function(code)
hello()
//'hello'
补充
v8的AST编译流程： 原始代码->scanner解析器进行解析-tokens->parser生成AST树并进行优化-AST树->Ignition生成字节码
