html - 模块化 CSS 技术

Question

我想开始使用模块化 CSS，但我无法找出实现它的最佳方式。我在想我可以只使用一种桥接技术，我的 HTML 中有一个，然后每个模块都有 @import 语句。虽然我喜欢这种方法的简单性，但我担心它对性能的负面影响，因为@import-ed 样式表将稍后下载，而不一定是并行下载。所以我想知道是否还有其他流行的技术来实现模块化 CSS。我真的不想做多个标签，因为 PageSpeed 和 Yslow 抱怨太多样式表（尽管我知道它实际上比 @import 更有效）。理想情况下，我想在服务器上将样式表合并为一个，因此浏览器只请求一个样式表。

Answer 1

在这里绝对推荐使用服务器端包含将您的“模块”组装到服务器端的一个样式表中。在服务器上拥有某种缓存也是如此，因此它不必对每个请求都进行组装。有很多可用的技术，但您的消息不包含有关您的软件堆栈的任何内容。

Answer 2

查看Compass CSS 框架。它通过 mixins 支持模块化 CSS，并通过添加变量、算术和包含诸如Blueprint之类的样式框架使 CSS 总体上更易于使用。

Answer 3

只是要非常小心你如何做到这一点。缓存是您的朋友，如果您选择交付专用的、服务器端生成的 CSS 页面，您将失去缓存的好处。这是经典的鸡和蛋问题。您是预加载和缓存所有 CSS 并预先获得点击，还是自定义加载每个页面并在每次页面更改时产生点击？只有你知道什么是最好的。

不要在这方面太过分。我曾在大型商店工作过，在这些商店中，微小的微小变化导致每天 5 gig 的改进（拥有数百万个唯一身份）......但我工作过的大多数网站根本看不到太多收益。如果你手头有时间，那就发疯吧。否则，请根据需要调整您的响应。那些优化器报告理想条件，我们都知道现实生活中并非如此。尝试在某些主要网站上运行优化器（也不要错过尝试验证它们） 为网络极客带来很好的乐趣。