实习笔记——浏览器篇
-
浏览器相关：
html不是上下无关语法，也不能用常规的自上而下或者自下而上的解析器解析，所以解析器的算法与js的解析有所不同。解析算法分为两个阶段：标记化和树构建。
标记化：也就是通过状态机解析代码，解析的过程中会有三种状态：标记打开状态，标记名称状态，数据状态。初始状态是数据状态，当遇到
<的时候转换为标记打开状态，然后接收到一个a-z字符，创建起始标记，状态变为标记名称状态（如果遇到的是/则会创建end tag token）。如果遇到>则会继续回到数据状态。树构建算法：树构建阶段的输入是一个来自标记化阶段的标记序列。然后也是采用状态机，这些状态又称为插入模式。构建的过程中通过读取标记进入不同的模式，然后创建HtmlElement元素然后附加到Document对象上。这个过程是往下递归的。直到接收到结束标记。
解析结束后，浏览器将文档标记为交互状态，之后开始解析处于
deferred的脚本。之后触发onload事件。浏览器的容错机制：将一些语法无效的错误纠正后继续工作。
css解析：css是上下无关语法，可以使用常规的解析器生成。比如webkit的css解析器就是使用flex和bison生成的。
布局：Dirty 位是用来避免细小改变影响全局布局的，对发生修改的render tree部分进行标记为dirty。共有两种，一种是dirty，一种是children are dirty。
全局布局和增量布局（全局布局往往是同步触发，增量布局是对dirty的部分进行重排，且是异步进行的）
绘制：全局绘制和增量绘制，同布局。
WebKit 矩形存储：在重新绘制之前，WebKit 会将原来的矩形另存为一张位图，然后只绘制新旧矩形之间的差异部分。
