我读到 CSSOM 创建是网页性能方面的瓶颈。但似乎有一些解决方法，比如将 media 属性添加到样式表链接。我试图了解如何优化我的网络应用程序并遇到了这个非常有趣的 link但无法理解 CSSOM 和 DOM 创建的顺序。
Here我看到一些关于异步加载 CSS 文件的引用，但答案不是很清楚。当然，这是关于加载而不是对象模型创建。
我的问题是:CSSOM 创建和 DOM 创建是并行发生还是依次发生？
最佳答案
是的，CSSOM 和 DOM 的创建是异步发生的，这只是合乎逻辑的。我建议您从 Google Web fundamentals 开始像rendering这样的主题进行了深入的讨论和解释。
DOM 构建在浏览器从网络请求中收到网页或从磁盘读取网页时立即开始。它开始“解析”
html并将其“标记化”，创建一个我们知道的节点的 DOM 树。在解析和构建 DOM 树时，如果它在
head或任何其他部分遇到链接标记，则引用外部样式表。 (来自docs)
Anticipating that it will need this resource to render the page, it immediately dispatches a request for this resource,...
- CSS 规则再次被标记化并开始形成我们所说的 CSSOM。当整个网页被解析并然后应用于 DOM 树中的节点时，最终生成 CSSOM 树。
When computing the final set of styles for any object on the page, the browser starts with the most general rule applicable to that node (e.g. if it is a child of body element, then all body styles apply) and then recursively refines the computed styles by applying more specific rules - i.e. the rules “cascade down”.
我们都注意到，在连接速度较慢时，首先加载 DOM，然后应用样式，网页看起来就完成了。这是因为这个根本原因 - CSSOM 和 DOM 是独立数据结构。
我希望它能回答您的问题并为您指明正确的方向。
PS:再次强烈推荐通读Google web performance fundamentals以获得更好的见解。
关于html - CSSOM 和 DOM 创建是异步的吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38842675/