Step 1: Add the gzip.php file.

Download the gzip.php file here. (V1.1.1)

Then add it to the root directory of your website.

Step 2: Adjust your HTML.

We now need to set your Javascript and CSS to run through the compression. We do this by adjusting the script and style addresses as follows…

For CSS

<link href="gzip.php?f0=css/main.css" rel="stylesheet" type="text/css">

For Javascript

<script src="gzip.php?f0=javascript/main.js" type="text/javascript"></script>

To change the address of the scripts just change the address that is in italic. Files are restricted to only files with the .css or .js extension.

Step 3: Merging Files.

Another slow point for loading time is using multiple Javascript files and CSS style sheets. The reason for this is for each file the browser needs to re-connect to the server before it can download it. However if you’re like me, you don’t want to have to merge all your files into 1 manually, so I’ve built in this ability into gzip.php. Simply merge files together as follows…

For CSS

<link href="gzip.php?f0=css/main.css&f1=css/more.css&f2=css/evenmore.css" rel="stylesheet" type="text/css">

For Javascript

<script src="gzip.php?f0=javascript/main.js&f1=javascript/more.js&f2=javascript/evenmore.js" type="text/javascript"></script>

So as you can see you can add files by adding in more f variables which count up from 0. You can add up to 100 files in the current configuration. Although if you have that many Javascript or CSS files then you should look at fixing that…

NOTE: Make sure you don’t miss any numbers when counting up otherwise it won’t include all your files.

Step 4: Caching Files.

Another trick that will help speed up your site is caching these files. Again I have that covered! Simply add cache=true& to the front of the file address as follows…

gzip.php?cache=true&f0=javascript/main.js&f1=javascript/more.js

If you don’t want to have the default 3 days expiry you may add in exp=#ofDays& and it will change the expiry period. For example the following will set the cache period to 31 days…

gzip.php?cache=true&exp=31&f0=javascript/main.js&f1=javascript/more.js

NOTE: It is not recommended that you cache files that are updated frequently as when the file is updated it won’t update in the browser for the number of days you set.

And there you have it! I have decreased loading time on my sites dramatically using this exact script so I hope it helps you out as much as it has with me!

UPDATE: Just released version 1.1.1 which adds new functionality and better ways to pinpoint errors. Release Notes.

UPDATE: Just released version 1.1 which fixes a security hole (thanks for the heads up Nail) as well as a number of other minor updates. Release Notes.