How to utilize a js minimization for a web site of a big organization

Question

I am looking for a JS minimization (maybe CSS as well) tool to use in our website. The site is fairly big and we cant manually minify files individually. We are also planning to use Long term caching for files and need to append like a version number to each file. I am afraid that this is very hard to keep track of when publishing frequently.

I know of tools like YUI Compressor, etc.. is there, but I am not sure how they are used for a big project like I have. Technically, I am looking for a script or an app that can be called after our development is finished to utilize it with the minified versions of files.

What are the common practices big companies use/follow these days ?? Any help is appreciated. I am just not sure what to search for.

Thank you.

Answer 1

I advise you to use a kind of makefile toolchain (there are many, for example ant or maven) to :

• concatenate your js files in one file
• then minify the resulting files (I use Google Closure Compiler, called with an ant target)

Note that making one file is the most important operation as on modern networks the latency due to the number of requests is much more a burden than the total size. This way you can easily work with dozens or hundreds of js (or css) files and don't hesitate to make a new one as soon as it helps the code source being readable and maintainable.

And this eliminates the need for the (manual or not) management of visible versionning of files for caching reasons.

As said recently in another answer, to help debug, my deployement scripts always make two versions in parallel : one non concatenated/minified and one concatenated/minified. The uncompressed version enables the development/test onsite without any deployement operation.