Rule 10 of Steve Souders High Performance Web Sites: Minify Javascript
The most common problem faced while implemnting this is how you handle the full and minified version and how to change there reference in referencing documents. One of the easier ways to do this is to make it part of the deployment process.
Here are the relevent steps involved.
I’m using YUI Compressor.
#!/bin/bash #Execute this script after checking out the latest source from repository. #Minify all javascript filescd /path/to/javascriptfor x in `ls *.js`do java -jar /path/to/compressor/yuicompressor-2.4.2.jar -o ${x%%.*}-min.js --preserve-semi $xdone #Minfiy all css filescd /path/to/cssfor x in `ls *.css`do java -jar /path/to/compressor/yuicompressor-2.4.2.jar -o ${x%%.*}-min.css $xdoneNow you don’t want to replace all references to x.css or x.js in your development code with references to x-min.css and x-min.js respectively. So what you can do is rewrite all those filenames at the web server level.
For apache the following rewrite rules work fine:
#enable rewritingRewriteEngine onRewriteRule /(.*)\.js /$1-min.jsRewriteRule /(.*)\.css /$1-min.cssCaution: Remember to delete existing minified css/js file before running the minifying script or you will end up with file names like x-min-min-min.js and so on. One way to do this is to clear the js/css folder before checking out files from your source repository.
