rvdavid: A Web Developer's Blog

As I was looking at shrinking the CSS and JavaScript files DevScripts from 60+kb and 70+kb respectively, I found a couple of helpful of good tools to keep handy when you’re dropping your projects into production.

To compress javascript I used the Code and Coffee online JavaScript compression/encoding tool, and for cleaning up the CSS, I used CleanCSS which was sent to me by a former colleague.

Code and Coffee: Compress Your JavaScript
http://www.codeandcoffee.com/2006/10/02/compress-your-javascript/
A good javascript compression tool – what I like about it is that it gives you the option of not garbling everything into one line – although you can if you wish to.
unoptimised JS size: 70kb
optimised and gzipped JS size: 21kb

CleanCSS: CSS Formatter & Optimiser
http://www.cleancss.com/index.php
A nice CSS optimiser. The unoptimised CSS for devscripts was a little bloated and used verbose shorthand for anything such as padding: 10px 10px 10px 10px; instead of padding: 10px. CleanCSS picked all this up and converted them to non-verbose/reduced shorthand. Not only that, but it also ripped out the documentation in the CSS file making for a much smaller file size.

unoptimised CSS size: 63kb
optimized and gzipped CSS size: 9kb

After this was done, I created an include script which will read all separate stylesheets into one file, then gzipped the output – but this is outside the scope of this commentary.

No related posts.

• Previous Entry: Quick Linux Shell Script Example
• Next Entry: My Web Development Firefox Extensions