较少的CSS性能和实现

Question

使用LESS for CSS的最佳方式是什么。

• 基本上应该让Devs编写一个Less文件，然后让它编译为生产
• 我应该链接LESS代码和javascript文件。
• 或者我应该完全跳过LESS溃败并重新制作课程

我正在努力争论一些相当草率的CSS，并希望在做出重大改进之前控制它。我认为拥有网站范围的变量是非常好的所以对于变量和嵌套来说，Less似乎是件好事。

我用css渐变和框阴影替换了很多背景图像，所以我也试图摆脱供应商的前缀。 有时我看到什么样的类看起来像类重载但是将很多类附加到诸如

之类的元素是不好的。

<div class="comment dark-shadow round-corners"></div>

Answer 1

Less是一种很棒的造型语言。我广泛使用它，它确实有助于代码可维护性，以及编写样式的速度。

我个人觉得你的风格不应该依赖于javascript来渲染，所以我使用less.app将我的所有LESS编译成CSS。我更安静地休息，知道我所有的CSS都在那里，并且在我把所有东西都“现场”之前它正常工作。

如果您有兴趣，我也一直在编译一个非常有用的LESS mixin库：https://github.com/jdmiller82/-lessins-

Answer 2

我同意Jonathan，我认为你不应该依赖用户浏览器来呈现样式。

我想出了一个解决方案，在服务器上使用node.js拦截styles.css之类的请求，并尝试查找等效的.less文件（在本例中为styles.less）并解析它并将其作为CSS返回。

因此，在您的服务器上，您只需styles.less，但您可以请求URL example.com/styles.css并获取已解析的LESS文件。这样，集成对于应用程序的其余部分是无缝的，并且不需要用户启用JavaScript。

您不必在应用的其余部分使用node.js。我是在PHP应用程序中完成的。

您可以在此处阅读我的教程：http://programming-perils.com/155/parse-less-files-on-the-fly-and-serve-them-as-css/

Answer 3

我意识到这个答案比上面的答案晚了两年，但我认为这个问题仍然有用。

我认为有一些用例，编译一些LESS客户端是个好主意（前提是你不支持IE 8或更低版本），并且你有一个验证它的用例。例如，我最近工作的应用程序有一个可定制的，可主题化的界面，需要根据它们所处的背景颜色是亮还是暗来修改文本颜色等，最终可能需要支持这种能力供用户更改并实时查看网站上反映的更改。对于客户端来说，这是一个很好的用例我认为。请注意，只编译了一个小的LESS样式表，并且预编译了与主题无关的应用程序的其余部分。我没有看到很多表现上的差异。

所以当你看到诸如“你并不认真考虑任何体面的开发人员使用较少的客户端吗？”这样的评论时，我会带着他们的意见。

Answer 4

将LESS用于生产网站的方法是将LESS文件编译为CSS文件。

对于本地开发，您可以拥有一个文件监视器，用于重建已更改的LESS文件的CSS文件。

如果您要从LESS生成多个CSS文件，则应将它们分开。

例如，如果您减少30个文件，并且它们生成两个CSS文件a.css和b.css，您将需要将这两个作业分开，以便您可以更快地编译。它的开发速度更快，因为如果更改任何影响它的LESS文件，你只会编译a.css。