Javascript/CSS压缩工具比较_[分享一下]

c2u 2011-08-18 01:27:36

原来公司是有一套JS压缩工具的，但感觉性能不是很好，而且不支持CSS压缩，所以查了一下资料，给大家分享一下。

目前有很多的CSS/JS压缩工具，
可以将类似：
function hello(longName) {
alert('Hello, ' + longName);
}
hello('New User');

紧压成：
function hello(a){alert("Hello, "+a)}hello("New User");

其中常用的有：
Yahoo的YUI compressor: http://developer.yahoo.com/yui/compressor/#support
Google的Closure Compiler: http://code.google.com/closure/compiler/docs/gettingstarted_app.html

两者是使用 Java 编写的开源项目，从体积上看Google的compiler.jar文件大一些，4.8M左右，而Yahoo仅有800多K，但从压缩效率来看，Yahoo的要比Goolge压缩后的文件体积大10%左右，但YUI compressor支持CSS压缩，cimpiler目前没有这个功能，不过CSS的压缩相对JS会相对简单很多。

使用也非常简单，先安装JDK或JRE，建立并运行批处理文件或在Command中直接输入命令，



java -jar compiler.jar --js all.js --js_output_file all-google.js

java -jar yuicompressor-2.4.6.jar all.js -o all-yahoo.js

就可查看二者的压缩结果了。

如图，基本上都压缩了５０%以上 494K -> 200多K

其实网站有一定规模以后JS文件是不可能写到一个里面的，JAR或压缩批处理文件也不可能在同一目录，一般需要将各个单独的闭包的JS文件（feature)合成一个，并再进行压缩，所以大多需要二次编程，但其实并不复杂。

也有公司将CSS文件也按Module/Feature划分成若干小文件，最后进行压缩合并，但个人感觉对于中小规模的项目来讲，有一点过度设计，因为CSS不像JS那样相对独立，这样不太利于CSS的复写重用和全局调整。

微软的MSN也有类似的工具，分别叫做CAT,JAT（CSS assembly tool和Javascript assembly tool)，还附带有另外一个Image Assembly Tool（IAT?）, 可以将 background-image：的若干小图按类型，分辩率合成大图，并自动重新计算background-position的位置，但个人感觉设计的有点过了，会使调整编译过程变得相当复杂。因为这些工具是闭源的（MS的一向风格）所以无从比较性能，不过估计没有google的性能好。

原文在此：　http://blog.sina.com.cn/s/blog_54da57aa0100v8u7.html

...全文