多次导入相同的CSS文件会添加任何性能问题吗？

Question

我见过有人讨论过多次加载相同的Javascript，因为代码每次运行时都会产生问题。

我在同一个DOM中多次包含相同的CSS文件（因为我使用了一些组件而无法避免添加它）：

    <link href="style.css" rel="stylesheet" type="text/css">

1. DOM大小会增加吗？
2. 每次包含时都会渲染CSS文件吗？
3. 这是否会影响页面的性能？

注意：由于我使用相同的CSS文件，因此只下载一次。

Answer 1

我认为这会增加不必要的开销，因为即使样式表缓存在浏览器中，它仍然需要检查它是否缓存多个包含（除非您的浏览器在获取它们之前聚合所有唯一样式表） ）。即便如此，我也希望延迟最小化，但绝对不是性能提升。如果将样式表拆分为多个文件，由于并发的http连接，您可能会在初始加载时获得感知的性能提升，但这种分离的软件维护成本可能不值得，并且它不会做任何事情你在后续页面加载。

Answer 2

如果您的CSS文件曾经渲染和使用过，则不会使用CSS的第二次导入，我认为它不会导致任何问题。例如：

import css 1
import css 2

然后你在这里<p class="test">，这个test只对css 1导入的这个标签使用一次，导入css 2只会导入而不会被使用。从这个意义上讲，我会说，这只是开销，并且需要花费少量时间来加载文件。我不认为这里有进一步的问题。