I had a somewhat lively discussion the other day about minifying Javascript and CSS versus someone who prefers using Gzip.
I'll call this person X.
X said that Gzip allready minifies the code, since it zips your files.
I disagree. Zip is a lossless method of shrinking filesize. Lossless means the original must be restored perfectly, meaning info must be stored to be able to restore the spaces, the un-needed characters, commented code and everything else. That takes up more space, since more must be compressed.
I have no method of testing, but I believe that the Gzip of this code:
.a1 {
background-color:#FFFFFF;
padding: 40px 40px 40px 40px;
}
Will still be bigger than the Gzip of this code:
.a1{body:background-color:#FFF;padding:40px}
Is there anybody who can prove this right or wrong.
And please don't come saying "It's right because that's what I've always used".
I am asking for scientific proof here.
Answer
Very simple to test. I took your js, put them in different files and ran gzip -9 on them. Here's the result. This was done on a WinXP machine running Cygwin and gzip 1.3.12.
-rwx------ 1 xxxxxxxx mkgroup-l-d 88 Apr 30 09:17 expanded.js.gz
-rwx------ 1 xxxxxxxx mkgroup-l-d 81 Apr 30 09:18 minified.js.gz
Here's a further test using a real-world JS example. The source file is "common.js" The original file size is 73134 bytes. Minified, it came to 26232 bytes.
Original file:
-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 73134 Apr 13 11:41 common.js
Minified file:
-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d 26232 Apr 30 10:39 common-min.js
Original file gzipped with -9 option (same version as above):
-rwxrwxrwx 1 xxxxxxxx mkgroup-l-d 12402 Apr 13 11:41 common.js.gz
Minified file gzipped with -9 option (same version as above):
-rwxr-xr-x 1 xxxxxxxx mkgroup-l-d 5608 Apr 30 10:39 common-min.js.gz
As you can see, there is a definite difference between the various methods. The best bet is to both minify as well as gzip them.