css - 使用 LESS 和 SASS 的性能

Question

我使用 Yahoo 的加速我的网站的最佳实践 ( http://developer.yahoo.com/performance/rules.html )，但是 LESS 和 SASS CSS 框架如何影响性能？它们比直接缩小的 CSS 文件慢还是快？

score 20 · Accepted Answer

LESS 和 SASS 都使 CSS 更容易编写和管理，因为它们具有强大的功能，如函数、变量和 mixin，但由于它们在部署之前编译为 CSS，它们丝毫不会影响性能。您的性能完全基于可以很好地缩小的 CSS 输出。

您可以使用像 less.js 这样的 javascript 解释器在客户端运行 LESS，但我还没有看到这样做的充分理由。由于 javascript 库的要求，它既慢（显然），而且几乎肯定更大。

score 6 · Accepted Answer

我同意@JTolley：SASS / LESS 相对于 CSS 的最大优势是提高了开发人员的性能。你可以用更少的代码做更多的事情，并保持你的项目结构和格式良好。

@进口

如果您将样式表拆分为多个文档，SASS / LESS 预处理器会将代码编译为单个 CSS 文件。纯 CSS 中的导入语句将导致多个请求。雅虎最佳实践：

减少页面中 HTTP 请求的数量是开始的地方。

SASS / LESS 中的样式声明与纯 CSS 中的声明相比没有区别：它们都是 CSS。但是话又说回来，我发现使用框架来工作和结构化要容易得多。变量、嵌套、混合和选择器继承帮助我更好地编码并最终获得更小的文件大小。

注意：嵌套很多会创建长选择器。长选择器需要更多的渲染时间。

从纯 CSS 到 SCSS 并返回很容易。CSS 是有效的 SCSS，SCSS 将输出 CSS。
所以试试吧。