Less.js 需要一秒钟来加载样式答案

【问题标题】：Less.js take a second to load stylesLess.js 需要一秒钟来加载样式
【发布时间】：2013-06-19 20:26:09
【问题描述】：

我的问题是，当您转到此页面 http://www.executivetravelholdings.com 时，页面样式会在一秒钟内加载。我希望它像使用常规 CSS 一样加载。我的头部样式表较少，主体底部的样式表较少。我使用的是 less.js 1.3.3 和 PHP 而不是 html。对此的任何帮助将不胜感激。

【问题讨论】：

问题不再有用，因为所指的网站已经消失，并且没有说明需要编译的文件更少。
投票关闭（尽管不难猜到答案是“只是不要使用客户端脚本并将你的 ls 文件预编译为 css”）。
我不久前试图删除这个问题，但它不让我。 @七相最大。我很久以前就想出了这个问题的答案。但是当我试图删除它时，它说这个问题有答案并且不能被删除。

标签： php less

【解决方案1】：

您应该只在开发期间使用客户端 LESS 渲染器：

客户端是最简单的入门方式，适合开发你的少。对于生产，尤其是在性能很重要的情况下，我们建议使用节点或众多第三方之一进行预编译工具。

LESS homepage

实际上，您可以：

安装Node.JS并渲染文件，然后把（静态）编译好的版本放到网上。
使用 GUI 应用程序编译 LESS 文件 like SimppLESS。确保它是最新版本，并且他们已将内部 LESS 版本保持在最新状态。（更简单）
如果您使用的是 PHP 之类的工具，则可以使用 LESS 编译器的 PHP 端口。这样，它在服务器端呈现并缓存。（更方便）

【讨论】：

感谢您的帮助。这真的帮助了我！

【解决方案2】：

你永远不会像原生 css 一样快，因为脚本必须先解析 css。然而，这种强大的 FOUC 形式源于这样一个事实，即您在正文中提供的脚本较少，因此在转换和应用样式之前会呈现完整的文档。解决方案是将less.js 脚本放在头部。是的，这会减慢页面加载过程，但我认为这是更好的权衡。

就个人而言，我从不（至少对于生产环境）使用 js 版本，但总是在服务器端处理样式。想象一下，用户已阻止 javascript 或根本没有可用的 javascript。

【讨论】：

谢谢我现在把less.js放在了头，它停止了延迟加载。感谢您的帮助！
这不是延迟加载——浏览器在找到相应的脚本标签时请求资源。由于您在正文底部请求较少的文件，因此文档的其余部分已经呈现（没有样式）。另一方面，延迟加载意味着在需要时加载资源（可能永远不会）。如果您的问题已解决，请接受您认为最适合表明您的问题已解决的答案。

【解决方案3】：

有一个备份样式表，至少将所有对象放在正确的位置，并且格式简单。

这样，当少的时候，变化就不那么明显了。

还可以让用户浏览器和服务器缓存您的 less.js 输出（如果可能）。这样您还可以改进导航。

【讨论】：

并非如此。如果浏览器禁用了javascript怎么办？仍然有很多人禁用 javascript。
正是我的想法（这是我在回答中所说的）。尽管如此，重复代码是不行的。你迟早会遇到很多问题。应该使用 Rikkus 解决方案之一来解决此问题。