如何组织和缩小大量的 javascript 文件？答案

【问题标题】：How to organize and minify lots of javascript files?如何组织和缩小大量的 javascript 文件？
【发布时间】：2013-12-11 09:24:53
【问题描述】：

我有一个用 PHP 和 JavaScript 编写的项目。

例如，我有两个主要的 JavaScript 文件 main1.js 和 main2.js。

他们使用相同的功能，我想将功能提取到 lib.js 等。

在开发环境中使用 3 个不同的文件更有用，但在生产环境中我希望有 2 个包含 lib.js 的缩小文件。

我想在没有任何预处理的情况下立即在 dev 上看到更改，并且我想在生产中使用一些预处理。

例如，我可以编写一个 javascript 函数 require(filename) 来加载所需的 js 文件，但是如何告诉 minifyer 在生产中包含内联文件？

【问题讨论】：

【解决方案1】：

你应该看看YUI Compressor

还创建makefiles

你也可以使用 YUI Compressor 压缩 CSS

【讨论】：

我讨厌 YUI Compressor，但我怀疑这是因为它是我用过的唯一压缩器而且我讨厌压缩。此时将请求缩小 10-20kb 真的有性能优势吗？
这取决于您希望如何保持代码井井有条，使用 YUI Compressor 我将 10 多个 JavaScript 文件合并为一个，使我的代码井井有条且易于管理。此外，如果您对服务器有 10 多个请求，则开销将远远超过 10-20kb：取决于您的浏览器一次可以处理多少个请求，您最终可能会遇到多个文件阻止其他文件下载，直到它们完成.巧合的是，这就是为什么有时也会将小图像放在 sprite-sheet 上的原因。

【解决方案2】：

如果您使用的是 netbeans，那么您可以使用此处的插件

你也可以使用

用于在线压缩

【讨论】：

【解决方案3】：

Coffee Script用于缓存浏览器端的js文件。它从所有文件中创建一个 js 文件，并缩小生成的代码。

【讨论】：

【解决方案4】：

您可以尝试这些在线缩小 javascript 和 css。

http://minify.avivo.si/#results

http://gtmetrix.com/minify-javascript-and-css.html

http://www.minifycss.com/

【讨论】：