Question

包含不必要的CSS是否会降低浏览器的速度（Chromium，Mobile Safari）？

我的意思是，

function insert_style_sheet()
{
    include "style_sheet.tpl";
}

在每个php文件中。模板文件style_sheet.tpl如下：

<link rel="StyleSheet" type="text/css" href="css/main.css">
<link rel="StyleSheet" type="text/css" href="css/controls.css">
<link rel="StyleSheet" type="text/css" href="css/whatever.css">

Answer 1

是的，您可以尝试使用YSlow等性能分析器测量差异。一个或两个额外的样式表可能具有可忽略的速度效果，具体取决于它的大小。基本上，更多样式表将此添加到管道中：

浏览器必须根据
更多HTTP往返抓取CSS文件（减少HTTP调用次数非常重要，请考虑合并样式表）
需要下载更多字节

作为Paul Irish recently tweeted，“当您优化网站/应用的效果时，您的优先级为1.网络连接2. DOM访问3. Javascript优化。”

Answer 2

它肯定会减慢您的网站速度。通过在可能的情况下组合它们来减少css文件的数量真的是最好的。它还取决于每个文件中的css有多少，无论它们是否臃肿。

Answer 3

页面加载时间受以下因素影响：

已下载的.css文件数
已下载.css文件的大小

页面性能:(最好在滚动或调整浏览器窗口大小时看到）

浏览器必须查找的选择器数量。
每个选择器上的属性数

所以......组合文件，删除未使用的css属性和选择器。压缩你的css，但保存一个未压缩的版本，这样你就可以编辑语义，然后压缩并保存它。

这就是我使用CSS的方式。希望它对你有所帮助！

不必要的CSS和优化

3 个答案: