如何在不同网页的文件组中自动化Javascript组合和缩小？

Question

假设我的页面结构是:

1. one.html :
   includes ->   a.js , b.js , c.js ,d.js

2. two.html :
   includes ->   a.js , b.js,  x.js, y.js, z.js

3. three.html :
   includes ->   a.js , b.js, s.js,  x.js, y.js

等等.有些页面访问量比其他页面更多,比如3页提供了网站所有页面浏览量的99%.

我正在寻找一个解决方案:

i)组合并最小化可以包含在页面中的组中的文件.

ii)具有将组的文件名映射到最终组合文件名的逻辑.

iii)包括像Google Closure编译器/ YUI压缩器这样的缩小器.

我看过的一个解决方案是: PHP缩小

它完成了大部分工作.但是它对我有以下缺点:

i)我将在CDN服务器上托管我的静态组合文件,而不是托管PHP minify的同一个Web服务器,因此PHP按组名缩小服务器文件的逻辑对我来说不起作用.

ii)PHP Minify使用PHP CGI来处理和提供脚本,而我希望我的缩小内容直接从CDN服务器提供.

PHP Minify是否有一些功能可以将组名映射到组合文件名,我可以在我的网页中使用它来直接设置组合JS文件的CDN路径.例如

<?php
  $groupName = array("onePage" => array('a.js','b.js','c.js','d.js');
?>

<script type="text/javascript" src="http://www.MYSTATICSERVER.com/js/<?php getMergedFileName($groupName)"></script>

而不是调用PHP Minify的PHP脚本来获取组的文件,这实际上是一个PHP页面调用,然后从以前生成的文件中提供javascript内容:

<script type="text/javascript" src="http://www.MYWEBSERVER.com/min/?g=onePage" ></script>

(我同意大部分可以通过将不同的解决方案与自定义部署脚本和缩小工具相结合来实现,例如ANT,FABRIC + YUICompressor/ClosureCompiler,但我正在寻找一个我可能错过的完善的可配置解决方案)

Answer 1

更新以显示 minify 的示例

使用 minify 似乎确实可行。我不确定您是否尝试过此操作，但将其发布给其他可能需要它的人

1) Minify 可以生成脚本的组合和压缩副本，并将其用作缓存，这样它就不需要在每次请求时处理所有文件。要启用此功能，只需使用临时目录的位置编辑 config.php 文件

$min_cachePath = 'c:\\xampp\\htdocs\\min\\cache';

2) 在 groupsConfig.php 中添加所有组后，只需向每个组发出请求，以便 minify 在缓存文件夹中生成输出文件

3) 对于每个组，您将在临时文件夹中找到 2 个文件，名称如下：

minify_g=group1_08da191ba9c60a0ed611d0de455bb7a4
minify_g=group1_08da191ba9c60a0ed611d0de455bb7a4.gz

4）您可以根据需要重命名文件并直接部署到您的CDN

5) 如果您的 CDN 允许 url 重写，您可以重写脚本 url 来提供 JS，而无需更改您提供的页面中的位置。

除非您有大量不同的配置，否则我建议您使用 YUICompressor 进行操作并部署到您的 CDN 网络。使用简单的 shell 脚本来自动化类似的事情实际上是非常简单的。但是，如果您的设置非常复杂，您可以考虑使用在 Node.js 之上运行的构建工具，例如grunt 。我一直在使用 Grunt 使用相同的代码库为不同的项目构建 JS 文件，并且效果很好。此外，还支持 OOTB 的 lint 和压缩。