less.js 负载影响
How much does less.js impact the speed of a site?
For standardization purposes, let's assume we're using Benchmark.less.
How much slower is the compilation process than the pre-compiled css? Also, at what filesize will users see a performance impact?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
您可以使用 Firebug 检查加载时间（您将确切地看到需要什么加载多长时间）。
此外，您仍然可以选择 在本地将 .less 编译为 .css，甚至在线编译你把它放在网站上。
编辑：
这是我在本地服务器上尝试 benchmark.less 的结果：
ps 无论负载影响如何，我仍然会在将其放到网上之前将其编译为 css，否则禁用 JS 的人将一无所获。
You can check load time with Firebug (you will exactly see what takes how long to load).
Additionally there is still the option that you compile your .less to .css locally or even do it online before you put it on the site.
EDIT:
Here is what I get trying benchmark.less on my local server:
p.s. No matter what the load impact is, I would still compile it to css before you put it online, otherwhise people with JS disabled will get nothing.
我使用 twitter bootstrap，并且 less.js 文件的页面加载速度有点慢。
只需加载引导导航，我的页面加载时间>准确地说是1秒（1.08秒）；那很慢。
但没有任何优化！
Im using twitter bootstrap and the page load is somewhat slow with the less.js file.
simply loading the bootstrap navigation and my page load time was > 1s (1.08s) to be precise; that is slow.
No optimizations whatsoever though!
如果您没有减少缓存并且正在运行一些简单的东西（例如 twitter bootstrap），则可能会增加一整秒的负载。它需要测试和缓存才能有效，否则结果可能对您的网站有害。
If you do not Cache less and you are running something simple like twitter bootstrap you can be adding a full second of load. It requires testing and caching to be effective or the results can be detrimental to your site.
我们在一个相当大的项目中使用较少（我们编译的 css 大约有 9k 行——并且我们已经竭尽全力使其保持最小）。在 Chrome 上，在快速笔记本电脑上运行本地服务器，less.js 在大约 600 毫秒内编译我们的 less 文件。在 Safari 上——其他一切都一样——它神秘地需要 5 秒（！）。在 Firefox 4.3s 上（！）。在我的第四代 iPad 上，这花费了相当长的时间。在速度较慢的网络上，情况更糟。
经过预编译，CSS 可以立即有效地加载到所有浏览器上。
值得注意的是，无论 Google 在 V8 中做什么优化，对于 less.js 来说都明显优于 Safari 和 Firefox 的引擎，但更关键的是：
直到最近，我们的 less 编译速度都足够快，以至于在所有浏览器（包括iOS 上的 Safari）。我们做了一些改变，但我们不知道是什么减慢了速度。如果有的话，我们的 less 文件变得更小而不是更大（我们有一个专门负责 CSS 优化的人）。
我们无法找到从 less 编译器中获取有用信息的任何方法。
我们考虑尝试使用 SCSS/SASS，但似乎每个人都从 SASS 切换到 LESS，所以我猜栅栏那边的草并没有更绿。
我想说的是，如果您对移动客户端（尤其是 iOS）感兴趣，请像避免瘟疫一样避免 less.js。
We're using less on a pretty large project (our compiled css is around 9k lines -- and we've gone to considerable lengths to keep it minimal). On Chrome, running off a local server on a fast laptop, less.js compiles our less files in about 600ms. On Safari -- everything else the same -- it mysteriously takes 5s (!). On Firefox 4.3s (!). It takes a stupid amount of time on my iPad 4th Gen. This is significantly worse on a slowish network.
Precompiled, the CSS loads effectively instantly on all browsers.
It's worth noting that whatever optimizations Google is doing in V8 are markedly superior for less.js than Safari and Firefox's engines, but here's the kicker:
Until recently our less compilation was sufficiently fast as to not be perceptible on all browsers (including Safari on iOS). We made some change, we don't know what that is slowing it down. If anything our less files have been getting smaller not larger (we have a guy dedicated to CSS optimization).
We cannot figure out any way of getting useful information out of the less compiler.
We contemplated trying SCSS/SASS instead, but it seems like everyone is switching from SASS to LESS, so I'm guessing the grass is no greener on that side of the fence.
I'd say that if you're interested in mobile clients (iOS in particular), avoid less.js like the plague.