就最终产品的性能/速度而言,根据最佳实践,Normalize.css应该作为单独的文件(从HTML头链接)保存,还是最好将其编译到最终的.css文件中?
我在这里和许多其他网站上搜索,但找不到答案。希望你能理解我的困境:
1.将normalize.css保留在node-modules文件夹中,并从我们的html链接到它我对编码还很陌生,但如果我正确理解这种方法,除了main.css文件外,我们还会向服务器添加一个(可能不必要?)请求?它对网站的性能/加载时间有多糟糕或有多费力?
<link rel="stylesheet" href="../node_modules/normalize.css/normalize.css">
<link rel="stylesheet" href="temp/styles/styles.css">
另一方面,我们可以:
2.使用'postpass-import'导入normalize.css和其他模块,并将它们一起编译成一个最终的.css文件
好的,现在我们把所有东西都放在一个地方,但我们刚刚在第一行我们实际的css之前添加了451行代码(和注释)。就可读性而言,这对我来说似乎不是最好的解决方案,但网站现在的加载速度会更快吗?
免责声明:到目前为止,我一直在使用第二种方法,但我开始问自己这是否是最佳解决方案。
提前谢谢。
如果网页在加载时向服务器发出的请求更少,那么它的加载速度就会更快,这一说法非常正确。您还正确地指出,组合文件的可读性不如单独加载的单个文件。
在你的处境中,哪一个问题对你来说更重要,这是一个只有你才能回答的问题。这就是为什么你很难找到明确的建议。
就我个人而言,我在开发中使用单独的文件选项,这样文件就很容易读取和调试。加载速度在开发机器上并不那么重要。
在生产网站中,我使用组合文件选项。事实上,我使用combine和minify来减少加载的文件数量,并使这些文件的大小尽可能小。在这种情况下,可读性就不那么重要了。
理想情况下,将normalize.css添加到最终css将在后处理步骤中完成,该步骤将所有源文件合并为一个文件并缩小整个文件。这样一来,您的源代码仍然可读,但最终只能加载一个文件。