各有优缺点,混搭着用。同时,也可以编进Ant里。
- q% d x0 }0 a压缩:
9 h( c; h! A) q6 _% ]$ nYUICompressor, r! f4 A: z4 L! o# {! x! b
支持JS和CSS
* `0 z5 _+ O7 s. ?8 E’ T4 L下载:http://yuilibrary.com/downloads/#yuicompressor$ Q2 X! x” j0 R, _
文档:http://developer.yahoo.com/yui/compressor/
- c: e’ l) ]; I8 X7 O快速上手:
9 |; t1 `! g” c: V+ [. o, \java -jar yuicompressor-x.y.z.jar myfile.js -o myfile-min.js –charset utf-8
E) I' e9 F0 a4 B1 NClosure Compiler4 d$ i5 m% ^- R X! \( `
不支持CSS文件压缩
: m4 X. U+ H0 Q% C6 w下载:compiler.jar) M8 g+ V& ~' m2 _2 V+ ?
文档:http://code.google.com/closure/compiler/docs/overview.html& j. ?: e, T5 z& M# r0 ?
要求:JRE 1.64 l" @2 |4 N( [* Q
快速上手:
4 |( E3 t$ D8 A1 [java -jar compiler.jar –js myfile.js –js_output_file myfile-min.js2 c# H* {6 z$ z/ K5 A( ~/ P
相关介绍:http://hikejun.com/blog/?p=476支 持多个文件合并:
1 O" O$ b* c3 r. Pjava -jar compiler.jar –js myfile-1.js –js myfile-2.js –js_output_file myfile-min.js
4 A, k: b) {" \合并:( W4 q: J' y- T+ G. ?
Combiner1 x+ J. D2 b: \+ p# p
下载:http://github.com/nzakas/combiner/downloads
0 i$ e4 e: k7 w- I0 o- H文档:http://www.nczonline.net/blog/2009/09/22/introducing-combiner-a-javascriptcss-concatenation-tool/
9 o7 u3 a) N9 U快速上手:, \( J8 U6 S0 I: {9 A
java -jar combiner-0.0.1.jar -v -o myfile.js *.js
3 ^5 u! k4 R! G: K4 Ijava -jar combiner-0.0.1.jar -v -o myfile.js myfile-1.js myfile-2.js
2 P- U& a H% ^8 G5 [+ j图片无损优化:
) V- E; X! f% e+ i5 g
Smusher7 \6 k7 v& X) {% k
调用smush.it 或 punypng 接口。
& L/ G* A2 n7 ]) h; u+ U文档:http://github.com/grosser/smusher
% A$ y’ S$ |: H要求:ruby + rubygems* B- p$ V8 E4 I* |) i# C* E: F
快速上手:, x0 g7 T% l# I” t! B, R% }: ?) y
smusher imgs/*.*
P8 j5 z6 a; k* r) O. msmusher imgs/*.* –service PunyPng- t& F% t5 C& |5 U
Mac下安装:- r4 M9 q8 V” K: V0 X {. ]& E
第一次安装smusher失败,缺东西需要先装xcode(OS安装盘2上有),再装行了。
. ?” ]6 |- q2 h’ }, r另注意punypng区分大小写 smusher macosxlogo.png –service PunyPng/ \9 }* J1 h’ J5 |
dataURI:
+ x$ J8 q/ _5 c7 t
CSSEmbed
/ l/ }: _’ c$ U4 r” ^4 Y’ \CSS中的图片转成 dataURI。(我不建议所有图片全部dataURI转换)9 H1 Z! v” M9 Q5 A/ I c
下载:http://github.com/nzakas/cssembed/downloads/& |0 h w5 P’ ~7 {
文档:http://www.nczonline.net/blog/2009/11/03/automatic-data-uri-embedding-in-css-files/
C4 h, ~9 w4 U1 n& R7 s快速上手:
3 g9 S/ | l$ _java -jar cssembed-x.y.z.jar -o styles_new.css styles.css7 L9 n# ~9 r ]. E, y! ^
dataURI
; P0 @1 b$ [! e! Y( @+ _本地或远程的图片转成 dataURI。3 Z9 Y5 o9 m* ^- D }/ m. O8 i
下载:http://github.com/nzakas/datauri/downloads/
8 u* l8 M. E4 t! E2 u0 i$ b快速上手:
6 }$ g8 ]. n) \! @4 T3 A& ijava -jar datauri-x.y.z.jar -o output.txt image.png/ X; T9 b2 |1 e; g2 A8 K# t! l
检查工具:
+ D’ w* |1 W6 E7 B0 c
WARI
) B6 {) v1 n; }0 @扫描js/css文件中的冗余,和没用 的图片。试了一下没用的css和图片找的比较准,javascript绑定的方法都算没用不准。这东西最大的好处是整站的找 RT @umutm: Web Application Resource Inspector – WARI – http://wari.konem.net/8 s9 G* | R0 q( I, m# E
下载/文档:http://wari.konem.net/6 ^/ n: D7 }3 ]4 F0 N6 P; w4 h
要求:JRE 1.6
/ }# a2 R! S” w% ]0 W6 O) u% l快速上 手:java -jar ~/Library/wari/wari.jar 弹出一个图形化界面。其实这不算命令行工具,这工具还是有点用的
+ P+ F3 f9 j+ V+ W6 E
Rhino + JSLint
$ p2 s( ~- \” [: s0 g+ E” G8 kJavascript/html代码品质检查工具。
; x+ |% H! \’ F& G; T$ g: ^介绍:http://www.JSLint.com/rhino/index.html用 法:java -jar rhino/js.jar rhino/fulljslint.js my_js_file.js4 Z# u, l# e2 W6 y
JRE 1.6 (Soylatte16-1.0.2 ) : http://hikejun.com/download/soylatte16-i386-1.0.2.tar.bz2