公司系统上海一客户的系统调优(三)-- 问题解决之二
针对js的优化。 以前只是采用了tomcat的压缩, 但是压缩的效果很明显, 但是目标不够。 所以要继续给js瘦身。
于是想到了js的压缩。 于是看了yui的压缩, 和谷歌的js 压缩。
对比一下:
yui功能相对简单, 代码也相对简单
谷歌压缩,不仅仅可以压缩, 他提供了更强大的优化功能。
针对公司的系统的特点。 觉的yui的压缩更合适。 因为现在主要是针对js的压缩, 不是优化。
特别是公司系统的js脚本写的十分分散。 往往是以函数级别的。 但是有时候很多个函数写在
同一个文件里面。 但是实际使用的时候, 这些函数不是都能使用的。 但是因为都包含在同一
个文件内部, 所以造成了js的体积不必要的增大,浪费不少资源。
所以初步设想是:
1、 程序自动合并js,
首先把多个js文件合并成一个js, 这样可以下载js时候不必要的的http连接。
2、 程序自动处理合并js里面的函数
去掉js页面里面不必要的js的函数, 这样可以缩减不必要的js代码(其实这个地方应该是写程序的时候处理好的,
但是现在已经没有办法, 代码太多, 手工修改的人力物力没有这么多)
3、最终目标是争取每个业务功能打开的时候, 访问业务页面的时候, http的连接次数保持在6次以内。
所以基于以上几点, js函数的压缩采用yahoo的, 因为如果采用了, 主要是代码比较容易修改, 修改代码如下。
case Token.RC:
result.append('}');
braceNesting--;
assert braceNesting >= currentScope.getBraceNesting();
if (braceNesting == currentScope.getBraceNesting()) {
//add by wjg
//System.out.println(getToken(0).getType());
if (offset < length && getToken(0).getType() != Token.SEMI)
result.append("\r\n");
//end add
leaveCurrentScope();
}
break;
case Token.SEMI:
// No need to output a semi-colon if the next character is a right-curly...
if (preserveAllSemiColons || offset < length && getToken(0).getType() != Token.RC) {
//add by wjg
System.out.println(braceNesting + " " + currentScope.getBraceNesting());
if (-1 == currentScope.getBraceNesting()) {
result.append(";\r\n");
} else
//end add
result.append(';');
}
做了如下修改, js压缩的时候产生的效果如下:
(原始文件)
var mytestvar = null;
var mytestvar1 = null;
/*
*tetstatat
*/
function testfuncone(testa, testb, testc) {
testfunctwo(testa, testb);//teatabc ok hello world
}
/*
*tetstatat
*/
function testfunctwo(testd, testf) {
testfuncthree(testd, testf);
}
/*
*tetstatat
*/
function testfuncthree(testg, testh) {
}
经过修改过以后的yui压缩如下:
var mytestvar=null;
var mytestvar1=null;
function testfuncone(b,a,c){testfunctwo(b,a)}
function testfunctwo(b,a){testfuncthree(b,a)}
function testfuncthree(b,a){};
这样代码比较容易进行下一步的处理。如果页面里面只是引用了
testfuncthree
那么看起来生成的文件就应该是:
var mytestvar=null;
var mytestvar1=null;
function testfuncthree(b,a){};