CSSOM 和 DOM 创建是异步的吗？

我读到 CSSOM 创建是网页性能的瓶颈。但似乎有一些方法可以解决这个问题，比如添加media样式表链接的属性。我试图了解如何优化我的网络应用程序，并发现了这个非常有趣的事情link https://developers.google.com/web/fundamentals/performance/但无法理解 CSSOM 和 DOM 创建的顺序。

Here https://stackoverflow.com/questions/4772333/are-css-stylesheets-loaded-asynchronously我看到一些关于异步加载CSS文件的参考，但答案不是很清楚。当然，这是关于加载而不是对象模型创建。

我的问题是：CSSOM 创建和 DOM 创建是并行发生还是顺序发生？

是的，CSSOM 和 DOM 创建是异步发生的，这是合乎逻辑的。我建议你从Google 网络基础知识 https://developers.google.com/web/fundamentals/?hl=en其中主题如渲染 https://developers.google.com/web/fundamentals/performance/critical-rendering-path/constructing-the-object-model?hl=en进行了深入的讨论和解释。

1. 当浏览器从网络请求接收到网页或从磁盘读取网页时，DOM 构建就会开始。它开始“解析”html并对它进行“标记化”，创建我们知道的节点 DOM 树。

2. 在解析和构建DOM树时，如果遇到link标签head或与此相关的任何其他部分，引用外部样式表。 （来自docs https://developers.google.com/web/fundamentals/performance/critical-rendering-path/constructing-the-object-model?hl=en)

预计需要此资源来呈现页面，因此 立即发送对此资源的请求，...

3. CSS 规则再次被标记化并开始形成我们所说的 CSSOM。当整个网页被解析并最终生成CSSOM树then应用于 DOM 树中的节点。

当计算页面上任何对象的最终样式集时，浏览器从适用于该节点的最通用规则开始（例如，如果它是 body 元素的子元素，则应用所有 body 样式），然后递归地细化计算的样式通过应用更具体的规则 - 即规则“层叠下来”.

我们都注意到，在慢速连接上，DOM 首先加载，然后应用样式，网页看起来已完成。正是因为这个根本原因——CSSOM和DOM独立的数据结构。

我希望它能回答您的问题并为您指明正确的方向。

PS：再次强烈推荐，通读一遍Google 网络性能基础知识 https://developers.google.com/web/fundamentals/performance/?hl=en以获得更好的见解。