含有外部 css 文件的渲染流水线 上图中,请求 HTML 数据和构建 DOM 中间有一段空闲时间,这段时间可能成为页面渲染的瓶颈。DOM 构建结束后,css 文件还未下载完成这段时间内,渲染流水线一直在等待,因为下一步是合成布局树。合成布局树需要 CSSOM 和 DOM,所以需要等待 CSS 加载结束并解析为 CSSOM。这种情况下,CSS 没有阻塞 DOM 的生成。 CSSOM 的作用 提供给 JS 操作样式表的能力 为布局树合成提供基础的样式信息 含有内联 JS 和 外部 CSS 页面的渲染流水线 从上图中可以看到,构建 DOM 过程中遇到 JS 会停止构建,去解