Gzip JS and CSS in Django

Question

Hi. I tried profiling my web application and one of the bottlenecks reported was the lack of gzip compression. I proceeded to install the gzip middleware in Django and got a bit of a boost but a new report shows that it is only gzipping the HTML files i.e. any content processed by Django. Is there a way I could kludge/hack/force/make the middleware gzip my CSS and my JS as well?

Could someone please answer my questions below. I've gotten a little lost with this.

• I might have gotten it wrong but people do gzip the CSS and the JS, don't they?
• Does Django not compress JS and CSS for some browser compatibility issues?
• Is compressing and minifying the same thing?

Thanks.

Answer 1

Follow Daniel Roseman's suggestion, "Your CSS and JS should not be going through Django on your production system"

If you want to serve through Django then you can compress css, js files using django-compressor, django-compress

Edit: added django-compressor

Answer 2

You should think about placing your django application behind an HTTP reverse proxy.

You can configure apache to act as a reverse proxy to your django application, although a number of people seem to prefer using nginx or lighttpd for this scenario.

An HTTP reverse proxy basically is a proxy set up directly in front of your web application. Browsers make requests from the reverse proxy, and the reverse proxy forwards the requests to the web application. The reverse proxy can also do a number of interesting things like handle ssl, handle gzip-compressing all responses, and handle serving static files.

Answer 3

Your CSS and JS should not be going through Django on your production system. You need to configure Apache (or Nginx, or whatever) to serve these, and when you do so you'll be able to set up gzip compression there, rather than in Django.

And no, compressing and minifying are not the same thing. GZip compression is done dynamically by the server when it serves your request, and the browser transparently unzips the file when it receives it. Minification is the process of removing comments and white-space from the files, and sometimes concatenating multiple files into one (ie one css and one javascript, instead of lots of each). This is done when you deploy your files to the server - by django-compress, as Ashok suggests, or by something external like the YUI compressor, and the browser doesn't attempt to reconstruct the original file - that would be impossible, and unnecessary.

Answer 4

Thanks everyone.

It seems that the GzipMiddleware in Django DOES compress CSS and JS.

I was using Google's Page Speed plugin for Firebug to profile my page and it seems that it was generating reports based on old copies (non-gzipped versions) of the CSSs and JSs in my local cache. These copies were there from the time before I enabled the Gzip middleware. I flushed the cache and it seems that the reports showed different results altogether.