我知道有人问过很多类似的问题，但我还没有看到对链接和管理样式的所有三种可能方法的比较。哪个是浏览性能最好和最差的？我知道 <link>推荐超过@import因为它允许并行下载，但我也听说单个大型 CSS 优于 <link>正在处理多个 css 文件。这是否意味着使用 @import比一个大的 css 还差？我原以为它们会以相同的方式工作，但也许它结合了两个世界中最糟糕的部分。
然后，实际上，我们在这里谈论的性能差异有多大？您典型的 5 页网站真的需要担心这个吗？
因此，要回答这个问题，最好能看到一些比较三种不同场景的基准或可信估计(即秒数)。
例如: 主.css (15kb) 特殊的.css (60kb) 网格.css (20kb)
在典型的服务器上，性能差异是什么:
- 使用
<link>对于所有三个 - 使用
<link>对于 main.css 和@import对于其他人 - 将它们全部合并到一个文件中
最佳答案
查看 Ben Callahan's recent talk关于这个话题。
我目前通过 SASS 将所有内容导入到一个大文件中，因为 gzip 确实可以压缩该文件，并且 1 个较大的 HTTP 请求优于多个较小的请求(当然在一定程度上)。
关于css - @import vs <link> vs 单体 css，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17310598/