Javascript缩小自动化

Sil*_*ght 3 javascript php performance minify

我有一个网站,使用了很多jquery/javascript.现在,在索引页面,我有大约10个javascript文件包含在头部:

<head>
<script src="/js/jquery.js"></script>
<script src="/js/jquery_plugin_1.js"></script>
<script src="/js/jquery_plugin_2.js"></script>
<script src="/js/jquery_plugin_3.js"></script>
<script src="/js/my_scripts_1.js"></script>
<script src="/js/my_scripts_2.js"></script>
<script src="/js/my_scripts_3.js"></script>
<script src="/js/my_scripts_4.js"></script>
<!-- ...and so on -->
</head>
Run Code Online (Sandbox Code Playgroud)

由于访客数量越来越大,我开始考虑所有这些的表现.我已经读过,最好将所有javascript文件缩小并合并在一起,这样浏览器必须只发出一个HTTP请求.我这样做了.现在我有everything.js包含所有javascript的文件,包括jquery,插件和我的自定义脚本.

<head>
<!--
<script src="/js/jquery.js"></script>
<script src="/js/jquery_plugin_1.js"></script>
<script src="/js/jquery_plugin_2.js"></script>
<script src="/js/jquery_plugin_3.js"></script>
<script src="/js/my_scripts_1.js"></script>
<script src="/js/my_scripts_2.js"></script>
<script src="/js/my_scripts_3.js"></script>
<script src="/js/my_scripts_4.js"></script>
...
-->
<script src="/js/everything.js"></script>
</head>
Run Code Online (Sandbox Code Playgroud)

当我需要对其中一个文件进行更改时,乐趣就开始了.每次,为了检查我的更改是否按预期工作,我需要压缩文件并更新everything.js或取消注释所有旧代码.通过这种工作流程,很容易忘记某些事情并犯错误.

问题:是否存在可以解决这一问题的自动化问题?还有什么东西可以让我按照以前的方式编辑我的单独文件,当我准备测试我的更改时,会缩小并整理所有内容?

我正在使用PHP5和SVN

谢谢你的帮助,每个人,我找到了我的解决方案:我将post-commit在我的SVN仓库中放置一个钩子,它将取出我的所有.js文件,将它们放在一起并使用YUI压缩器缩小它们.然后,在我的脚本中我将分叉javascript包含,这样在开发环境中该站点将包含单独的javascript文件,但在生产中将包含组合和缩小的文件.

Dav*_*dža 5

我们有自定义部署脚本来处理它.简而言之,它使用YUI Compressor缩小所有CSS和JavaScript文件,并将它们打包到最多两个文件中,一个是普通文件,另一个文件是给定页面的特定逻辑.完成后,我们创建一个符号链接(或一个新文件夹,具体取决于项目)到包含文件的文件夹,并立即传播新的更改.除了开发之外,所有环境都使用此方法.

在缩小之前,这就是CSS结构的样子(对于JavaScript来说,它或多或少是相同的,它只是为了给你一个想法):

css/Layout/Core/reset.css
css/Layout/Core/index.css
css/Layout/Tools/notice.css
css/Layout/Tools/form.css
css/Layout/Tools/overlay.css
css/Skin/Default/Core/index.css
css/Skin/Default/Tools/notice.css
css/Skin/Default/Tools/form.css
css/Skin/Default/Tools/overlay.css
css/Layout/Tools/gallery.css
css/Layout/Tools/comments.css
css/Layout/Tools/pagination.css
css/Layout/Index/index.css
css/Skin/Default/Tools/gallery.css
css/Skin/Default/Tools/comments.css
css/Skin/Default/Tools/pagination.css
css/Skin/Default/Tools/achievements.css
css/Skin/Default/Tools/labels_main.css
css/Skin/Default/Index/index.css
Run Code Online (Sandbox Code Playgroud)

后:

minified/1290589645/css/common.css
minified/1290589645/css/0135f148a7f6188573d2957418119a9a.css
Run Code Online (Sandbox Code Playgroud)

我们喜欢这种方法,因为它不需要动态处理任何其他代码.这只是一个部署问题,每两周发生一次.我们的登台环境每天更新,有时甚至每天更新一次,我们还没有遇到任何问题.