Tools for concatenating and minifying CSS and JavaScript files in different development environments

To follow up on the topic of cutting down the number of HTTP requests that I mentioned in my posts How to improve your web site performance – tips & tricks to get a good YSlow rating and How to reduce the number of HTTP requests, I wanted to put together a good list of tools and approaches to concatenate and minify CSS and JavaScript files in different developing environments.

Based on my own experience and research, and the replies when I asked around what others use, I have listed suggested solutions below:

PHP

Minify
Minify combines multiple CSS or JavaScript files, removes unnecessary whitespace and comments, and serves them with gzip encoding and optimal client-side cache headers.
Combine
PHP script combined with URL rewriting to concatenate and compress CSS and JavaScript files.
SmartOptimizer
A PHP library that enhances your website performance by optimizing the front end using techniques such as minifying, compression, caching, concatenation and embedding. All the work is done on the fly on demand.
CSSTidy
Compression of CSS files. Note: no support for JavaScript files.
JSMin+
PHP-based and it parses the JavaScript. Note: no support for CSS files.
CSScaffold
Compresses, caches and gzips CSS on-the-fly. Note: no support for JavaScript files.
CSS-JS-Booster
Concats, minifies and gzips CSS and JavaScript files.
CSS Crush
Concats and minifies CSS files.

Django

Django Static Management
Intended as an easy way to manage multiple static text assets (CSS and Javascript) in a Django projects.
Django compressor
Compresses linked and inline javascript or CSS into a single cached file.
django-compress
django-compress provides an automated system for compressing CSS and JavaScript files. Note: Doesn’t support concatenation of files..
Deploying compacted javascript with django
Management command to compatct JavaScript. Note: No support for CSS files..
Templatetag for JavaScript merging and compression
A templatetag that merges several JavaScript files (compressing its code) into only one JavaScript file. Note: No support for CSS files..

Ruby

Sprockets
Sprockets is a Ruby library that preprocesses and concatenates JavaScript source files.
Juicer
Compresses CSS and JavaScript code, JSLints it and also supports Data URI-embedding of images in CSS files.
Jammit
Jammit is providing both CSS and JavaScript concatenation and compression, as well as YUI Compressor and Closure Compiler compatibility, ahead-of-time gzipping, built-in JavaScript template support, and optional Data-URI / MHTML image embedding.
AssetPackager
Merges and compresses JavaScript and CSS when running in production.

Java

YUI Compressor
The leading tool in the for compressing CSS and JavaScript files, and could easily be ported/encapsulated into other environments. Note: Doesn’t support concatenation of files.. Could be used in conjunction with an Ant task, as described in Building Web Applications With Apache Ant
Google Closure Compiler
Google Compiler for JavaScript that supports various compressing options for JavaScript. Note: no support for CSS files.
Jawr
Supports concatenation and minification of CSS and JavaScript files.
Granule
Combines and compresses CSS and JavaScript files.

.Net

YUI Compressor for .Net
A .NET port of the Yahoo! UI Library’s YUI Compressor Java project.
Packer for .NET
A tool to pack/minify CSS and JavaScript files.
Microsoft Ajax Minifier
A tool to concatenate and minify JavaScript files. Note: no support for CSS files.
CombineAndMinify
A tool to concatenate and minify CSS and JavaScript files.
StyleManager
A tool to concatenate and compress CSS files.

Other tools or approaches?

Please let me know, by writing a comment, if you want to suggest other tools, so I can update this list and keep it as accurate and useful as possible!

Posted in CSS,Developing,JavaScript,Technology |

71 Comments

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>