How to use grunt-contrib-uglify to gzip the js files also?

Question

I'm running a grunt task:

uglify: {
    options: {
        report: 'gzip'
    },
    all: {
        expand: true,
        flatten: true,
        cwd: 'js/',
        src: ['*.js', '!*.min.js'],
        dest: 'js/min',
        ext: '.min.js'
    }

}

The files are compressed onto one file, while running the report option

options: {
    report: 'gzip'
}

I see that the files would be significantly smaller when gzipped, but the output files are not gzipped, they are the size as per the "minified" report.

So the question is, how do I configure uglify to gzip the files also. Or is this a task for a different task?

Kino

I was thinking about using grunt-contrib-uglify to gzip my js files, but then I realized I have a lot more to compress, so I handed the compression process to grunt-contrib-compress github.com/gruntjs/grunt-contrib-compress – Sulfur

Answer 1

gzipping is a technique used by a webserver to pack static assets, helping to reduce the size of transmitted data by half or more. The gzip report just lets you know how much the technique will save, but it is obviously unable to compress the file beyond normal minification. This post has some further information if you're interested:

http://betterexplained.com/articles/how-to-optimize-your-site-with-gzip-compression/

Personally I'd turn gzip reporting off since it doesn't perform well; perhaps only save it for when you're ready to deploy.

Evasive

yes i did turn it off as it took a while, i was thought since you could report on it, there was a way of turning it on ... – Kino

If you want to enable gzipping on your server you'll need to use the correct gzip package depending on what you're using (they are different if you use nginx or apache). Then the server can automatically gzip the asset types that you specify. But let me reiterate; you cannot gzip through Grunt. :) – Evasive

You can actually gzip files with grunt-contrib-compress, but you would need to configure the server to return the pre-gzipped files. – Hydrozoan

Answer 2

You need to manually gzip files and set the response header "encode-type" to "gzip" if your hosting your files/assets on an S3. SO i need this feature as well as a grunt task to sync files or at the very least deploy files.

Nagle

Totally agree; S3 is my use case also. It is very easy to set the metadata for "Content-encoding" to gzip in the S3 API call. I am just starting with Grunt and would LOVE to find out there is a way to upload to S3 after gzipping, even if it means shelling out to a custom java -jar – Remittee

if you are serving your files from cloudfront, there is now an option to automatically compress the files. I gained some 80% compression. Cheers! – Charles

Answer 3

You can add grunt-contrib-compress to your workflow and configure your webserver to use the gzipped version. On nginx that would be turning on gzip_static

Outwardbound