为什么要构建 DOM 树呢?
浏览器无法直接理解和使用 HTML，所以需要将HTML 转换为浏览器能够理解的结构——DOM树。
CSS 文本中有很多属性值，如 2em、blue、bold，这些类型数值不容易被渲染引擎理解，所以需要将所有值转换为渲染引擎容易理解的、标准化的计算值，这个过程就是属性值标准化。
计算出 DOM 树中可见元素的几何位置，我们把这个计算过程叫做布局。
从图中可以看出，渲染流程的前三个阶段:DOM 生成、样式计算和布局。要点可大致总结为如下: 1、浏览器不能直接理解 HTML 数据，所以第一步需要将其转换为浏览器能够理解的 DOM 树结构; 2、生成 DOM 树后，还需要根据 CSS 样式表，来计算出 DOM 树所有节点的样式; 3、最后计算 DOM 元素的布局信息，使其都保存在布局树中。
CSS和JS下载都是异步的，也就是在解析DOM的过程中下载。
