For a large number of Ajax applications that use JavaScript and CSS, if Javascript and CSS are of large size, it may take a long time to transmit them to the client, resulting in poor website performance. It is natural to compress JavaScript and CSS.(WhereYui compressor has a compression rate of about 50%.)
Yui Compressor-The Yahoo! JavaScript and CSS Compressor
Yui Compressor:
- Remove comment
- Remove extra spaces
- Minor Optimization
- Identifier replacement)
Download: http://yuilibrary.com/downloads/#yuicompressor
The Yui compressor requires Java version> = 1.4. (The machine requires an environment above Java 1.4)Therefore, you must first download JDK and configure the environment.
--------------------------------------------- Gorgeous split line ---------------------------------------
1. perform the following steps to configure JDK environment variables in the Java environment: 1. My computer --> properties --> advanced --> environment variables. 2. Configure user variables: A. Create java_home C: \ Program Files \ Java \ j2sdk1.5.0 (JDK installation path)B. Create Path % Java_home % \ bin; % java_home % \ JRE \ binC. create classpath .; % java_home % \ Lib; % java_home % \ Lib \ tools. jar3. test whether the environment variable configuration is successful: start --> Run --> press cmd: The corresponding command appears in javac, instead of the error message, indicating that the configuration is successful!
--------------------------------------------- Gorgeous split line ---------------------------------------
Ii. Use Yui compressor to compress JS and CSS
Common examples (executed in cmd)
Java-jar D: \ yuicompressor-2.4.6 \ build \ yuicompressor-2.4.6.jar -- Type JS -- charset UTF-8 D: \ My. js-o d: \ my-min.js
Java-jar D: \ yuicompressor-2.4.6 \ build \ yuicompressor-2.4.6.jar -- type CSS -- charset UTF-8 D: \ my.css-o d: \ my-min.css
-Type: Specifies the file type to be packaged. The options include JS and CSS.
-Charset: Character Set
-O specifies the output file name. If this parameter is not specified, the compressed content will be output to the command line.
The final my.js and my.css are the debug source files to be packaged.
If the charset parameter is not given, the character set defaults to the system, where the UTF-8 is specified, and you actually need to modify it. For more information about the syntax and other parameters, see: http://www.julienlecomte.net/yuicompressor/
Use Yui compressor and DOS batch processing scripts to compress JavaScript and CSS, and addGzip of IIS, Add up to get85%Compression ratio between left and right. (WhereYui compressor has a compression rate of about 50%.You can also modify the parameters to obtain more compression ratios.
--------------------------------------------- Gorgeous split line ---------------------------------------
3. Prepare a batch processing tool
Three files:
Batch File: yuicompressor. bat
Registry File: yuicompressor. Reg
Compressed jar package: yuicompressor-2.4.6.jar
File directory: D: \ Server \ f2etools \ yuicompressor
How to Use yuicompressor. BAT for batch processing:
Right-click the entire folder and choose 【Yui-compressor JS/CSSBatch compression operations generate -min.css or-min. js. The source files remain unchanged. The source files are referenced during normal development of the project, and the compressed files are referenced before release.
Yuicompressor. bat batch fileCode:
CD " % 1 "
For / F % A in ( ' Dir / B *-min . Js' ) Do Call : Processdel : %
For / F % A in ( ' Dir / B *-min . CSS' ) Do Call : Processdel : %
For / F % A in ( ' Dir / B * . Js' ) Do Call : Processcompress : %
For / F % A in ( ' Dir / B * . CSS' ) Do Call : Processcompress : %
: Processdel
If Not[% 1]=[]Call: Deleteminfiles:% 1
Goto: EOF
: Processcompress
If Not[% 1]=[]Call: Compressfiles:% 1
Goto: EOF
: Deleteminfiles
If Exist "% Cd % \ % 1" Del "% Cd % \ % 1"
Goto: EOF
: Compressfiles
Java-jar D:\Server\F2etools\Yuicompressor\Yuicompressor-2.4.6.Jar% 1-O % ~ N1-min % ~ X1
Goto: EOF
Yuicompressor. reg registry function: Right-click the folder and select an option 【Yui-compressor JS/CSS]
Yuicompressor. reg registry file code:
Windows Registry Editor Version 5.00
[Hkey_classes_root \ directory \ shell \ compress JS/CSS files]
@="Yui-compressor JS/CSS"
[Hkey_classes_root \ directory \ shell \ compress JS/CSS files \ command]
@="D: \ Server \ f2etools \ yuicompressor. Bat % 1"
: Http://heiniu.me/tools/yuicompressor.rar
Note: Modify the directory paths in the two files.
Batch File: yuicompressor. BAT and Registry File: yuicompressor. Reg
--------------------------------------------- Gorgeous split line ---------------------------------------
4. packing compression pack-all-min.js
The file is as follows:
Batch files: pack-js.bat
Directory files to be packaged: pack-list.txt
Pack-js.bat code:
For / F % I in ( Packlist . Txt ) Do Type % I > Pack-all . JS
Java-jar D:\Server\F2etools\Yuicompressor\Yuicompressor-2.4.6.Jar --TypeJS -- charset UTF-8Pack-all.JS-o pack-all-min.JS
Pack-list.txt
Jquery . UI . Datepicker . JS
Jquery . UI . Dialog . JS
Jquery . UI . Draggable . JS
Jquery . UI . Mouse . JS
Usage:
Put these two files in the current JS folder, usually develop multiple source files, run the pack-js.bat to view the page effect, package into a compressed file before going online, the test is correct and then go online.