CSS 微优化答案

【问题标题】：CSS micro-optimizationCSS 微优化
【发布时间】：2010-12-05 21:34:00
【问题描述】：

我正在考虑对一个巨大的 CSS 样式表进行微优化，并有几个与此相关的问题：

小写字母比大写字母更能减小文件大小吗？
是背景位置：右（5 个字符）；小于背景位置：0 100%；（6 个字符，包括空格）？

还有什么可以帮助减小文件大小的吗？（当然除了合并 CSS 选择器、属性等，我必须手动完成）

谢谢

【问题讨论】：

我很好奇：如果你需要纳秒级的速度提升，你在做什么样的项目？它不能是一个标准的企业网站，背后有 CMS，这是肯定的。

标签： css micro-optimization

【解决方案1】：

字符大小写无所谓，字节数没有区别。
取决于浏览器：

第一个语句短了一个字节，但也有不同的含义。

一般来说，文件大小并不是计算速度的唯一因素。它还取决于浏览器解释它的难度。因此，任何过于巧妙的 CSS 构造都可能会从总大小中挤出一些字节，但解析过程本身可能需要更长的时间。

回到你的例子：第二个语句可能会慢一点，不仅仅是因为额外的空间，而且值由两个标记组成，并且取决于背景的内部表示，浏览器可能有做一些单位转换。另一方面，关键字查找也可能需要更多时间，因此它确实特定于某个浏览器实现。任何收益很可能都在纳秒范围内，您不应该为这种优化而烦恼，因为它很可能不会得到回报。但如果你真的想这样做，你必须进行分析，即测量加载时间。

一般来说，删除所有 cmets 和所有不必要的空格就足够了，但永远不要对那个“缩小”的源进行任何开发工作。保留原始版本并在需要时重新创建压缩版本。

有关此主题的更多信息：www.minifycss.com 和 this。

【讨论】：

1) 那么它的 x 字节呢？ 2）愿意详细说明吗？谢谢
如果您要对 css 进行 gzip 压缩，删除空格不会保存任何内容 - 事实上，它可能会增加 gzip 压缩输出的大小。
由于我正在做微优化，我在纳秒内处理。无论如何，如果你要选择“正确”或“0 100%”，你会选择什么？ :)
@Alexander：相对压缩可能会更好，但是向数据流添加空格如何减少压缩输出的绝对大小？（严肃的问题！）
@Nimbuz：我没有足够的事实来选择一个，这将是纯粹的猜测:) 最好的办法是测量加载时间差。

【解决方案2】：

你最好为压缩的 css 提供服务，而不是担心这样的事情。

【讨论】：

是的，但 gzip 压缩时空格几乎没有什么区别，因此这是获得大量结果的好方法。
@Nimbuz：实际上，这是第一步。 Gzip 将使任何事情产生最大的不同。 gzip 和 minify+gzip 的区别可以忽略不计。

【解决方案3】：

听起来这很麻烦，如果您想获得更好的性能，最好将时间花在其他地方。您知道 Steve Souders 在高性能网站上的工作吗？ http://stevesouders.com/hpws/

【讨论】：