一尘不染

@import vs链接

css

首先,我知道标题说的是一个重复的问题,如此处),此处和此处所问。我在该主题上阅读的所有内容均已存在两年以上。在那段时间里发生了很多变化,所以同样的想法仍然值得建议吗?

这是一个示例,我在样式表中使用@import来引入重置的CSS和其他两种样式。我应该将其从更改@import<link>吗?根据本文,我应该使用链接。因此,我问其他开发人员,到目前为止,什么才是真正的最佳方法(2011年8月25日)


阅读 191

收藏
2020-05-16

共1个答案

一尘不染

在过去的一两年中,如果发生任何变化,变化不大,从那时起,我们仍在使用许多相同的浏览器,因此您不应更改自己的做法。

<link>在所有情况下均优先于@import,因为后者会阻止并行下载,这意味着浏览器将等待导入的文件完成下载,然后再开始下载其余内容。

因此,虽然@import可能很方便,但仅此而已。如果您真的想利用快速的加载时间,请使用最少数量的样式表(在大多数情况下可能是一个),使用高效的选择器(常用的东西)编写好的CSS,将其最小化并使用<link>标签。


这将是一个评论,但时间太长:

相反的@import(我知道这
很方便的),那么当你的网站开始运行的文件合并成一个。无论如何,您都不应该在那一点上进行调整,并且有许多工具可以帮助您将其最小化。就个人而言,使用PHP,我有一个配置文件,其中定义了所有写到单独CSS文件中的CSS文件(我将在<link>标记中引用的CSS文件),然后如果缓存的版本是旧的(手动或自动确定)
,它将它们合并/最小化,然后将内容写入“缓存”文件,然后返回时间戳查询字符串以附加到CSS文件名以强制重新下载。

如果还使用PHP,我强烈建议使用cssmin,它可以解析样式表@import并将内容拉到一个文件中,以及处理缩小的所有方面。

2020-05-16