Browser 面试题合集 #

渲染流程 #

html css js 是如何变成页面的？

1. 解析 HTML，构建 DOM 树

2. 样式计算

   • 把 css 转换为浏览器能够理解的结构（styleSheets）
   • 样式属性值标准化
   • 计算出每个 DOM 元素的具体样式

3. 布局阶段

   • 创建布局树（DOM 树中有很多不可见的元素，包括 head 标签、display:none 的元素... => 布局树中不包括不可见的节点）
   • 布局计算（计算各节点的坐标位置）

4. 分层（图层）

5. 图层绘制

6. 栅格化操作（绘制用户当前看到的页面部分）

7. 合成和显示