关于内联 CSS 与内部 CSS 与外部 CSS，我了解缓存问题，以及大文件的多次下载和单次下载之间的权衡。我想知道的是渲染速度如何变化，基于您可以放置 CSS 的三个位置。
换句话说，实际绘制页面所需的时间最少？我假设 external 是最慢的，因为即使它被缓存，浏览器仍然必须检索规则，解析它们，并将它们应用于当前元素。我还假设内部（在页面中但在样式标签内）将是第二慢的，因为仍然存在解析规则并确定将哪些规则应用于哪些元素的过程。而且我假设内联（直接通过样式属性应用）是最快的，因为浏览器可以跳过将规则与元素匹配的过程。
有人深入研究过这个吗？我知道我在具有复杂 CSS 的大页面上遇到了一些渲染问题，这些问题只能通过内联来解决。 （拜托，不要讲复杂 CSS 的大页面的弊端。）
【问题讨论】：
标签： css
无论哪种方式，一旦加载了实际的规则文本，它就会通过相同的 css 解析器运行 - 外部与外部没有不同的解析器。内部 CSS。这一切都只是CSS。外部应用可能会慢一些，因为它需要额外的 HTTP 请求来获取该文件，但是一旦它被传输到主机浏览器，它的解析速度就和你在物理上嵌入相同的规则一样快内联 <style> 块。
【讨论】：
我认为您不必关心哪种模式最快。在任何情况下，HTML、CSS 和 JS 并不意味着要快速。
我认为您应该担心可读性和可维护性，考虑使用直接应用在 HTML 标记中的样式来管理网页。你将无法以这种方式管理任何复杂的事情。
您要问的主要取决于浏览器的实现（关于可以根据我们正在谈论的解决方案单独下载的css文件）。无论如何，我认为差异不会太大，因为它们都需要由同一个解析器解析。
如果页面真的太复杂而无法使用样式表进行样式设置并且需要内联样式，那么问题不应该通过内联 css 而是通过在不同级别重构事物来解决。
此外，我想说许多性能问题可能是由于编写没有任何结构的 CSS 导致的，只是每天添加一些东西，甚至没有考虑使用严格/聪明的选择器。边思考边开发（这在 Web 开发中通常被遗忘，尤其是前端）通常是最好的方法。
【讨论】：