CSS解释器和样式布局
从整个网页的加载和渲染过程来看，CSS解释器和规则匹配处于DOM树建立之后，RenderObject树建立之前，CSS解释器解释后的结果会保存起来，然后RenderObject树基于该结果来进行规范匹配和布局计算。当网页有用户交互或者动画等动作的时候，通过CSSOM等技术，JavaScript代码同样可以非常方便地修改CSS代码
解释过程
CSS解释过程是指从CSS字符串经过CSS解释器处理后变成渲染引擎的内部规则表示的过程。 在解释网页中自定义的CSS样式之前，实际上WebKit渲染引擎会为每个网页设置一个默认的样式，这决定了网页所没有设置的元素属性及其属性默认值和将要显示的效果。 样式规则建立完成之后，WebKit保存规则结果在DocumentRuleSets对象类中。当DOM的节点建立之后，WebKit会为其中的一些节点选择合适的样式信息（依次按照ID、类别、标签等选择器信息逐次匹配获得元素的样式）
WebKit布局
当WebKit创建RenderObject对象之后，每个对象是不知道自己的位置、大小等信息的，WebKit根据框模型来计算它们的位置、大小等信息的过程称为布局计算。
Frame类，用于表示网页的框结构，每个框都有一个FrameView类，用于表示框的视图结构。
FrameView类主要负责视图方面的任务，例如网页视图大小、滚动、布局计算、绘图等，它是一个总入口类。
布局计算是一个递归的过程，这是因为一个节点的大小通常需要先计算它的子女节点的位置、大小等信息。
哪些情况下需要重新计算布局呢
首先，当网页首次被打开的时候，浏览器设置网页的可视区域（viewport），并调用计算布局的方法。这其实也描述了一种常见的情景，就是当可视区域发生变化的时候，WebKit都需要重新计算布局，这是因为网页的包含块的大小发生了改变。
其次，网页的动画会触发布局计算。当网页显示结束后，动画可能改变样式属性，那么WebKit就需要重新计算。
然后，JavaScript代码通过CSSOM等直接修改样式信息，它们也会触发WebKit重新计算布局。
最后，用户的交互也会触发布局计算，例如翻滚网页，这会触发新区域布局的计算。
