Reduce Wordpress Bandwidth Usage and Improve Page Load Time

How to use PHP output buffering and compression to reduce bandwidth usage and improve page load speeds, an important SEO metric.

It will also reduce bandwidth (and save bandwidth costs!) and make the files faster to download, meaning your website will load quicker!

This technique involves compressing files before they are sent to the browser. You need to be running PHP with the GZip module loaded. If you're not sure if you have the module loaded, you can test by creating a phpinfo.php file with the following code:

<php echo phpinfo(); ?>

Upload this to your server and access it. You will see lots of information about your server config. Scroll down to the section titled zlib, and under status, it should say Enabled. If not, you must speak with your provider to enable it. Don't forget to delete the file when you're done looking - it could be a security threat.

Next, you will need to find out what files are hogging your bandwidth. You can use a free Apache log analyser to report on bandwidth by file.

My top bandwidth hogs were over one month for one site:

We have to note that access isn't necessarily a download. The browser could get the file header to see if it's been changed since the cached version was downloaded.

This technique only works on text files such as PHP files, CSS style sheets, Javascript/VBScript, etc...
Unfortunately, it will not work on JPEG, GIF or PNG images as they are already compressed. It will work in almost 99% of browsers; if it isn't supported, they get the normal uncompressed version.

I will use my number one culprit for this example, prototype.js. Weighing in at a whopping 95kb, this Javascript file is used by WordPress and downloaded over 1000 times a day on one of my sites; that's 95MB per day or nearly 3 Gigabytes per month!!!

Prototype.js is usually installed in {BLOG_DIR}/includes/prototype.js, so we need to open up this file in a text editor and add the following line at the very start of the file. There must be no whitespace before this code; otherwise, it will not work. Please make a backup copy of any file you change in case something goes wrong.

<?php if(extension_loaded('zlib')){ob_start('ob_gzhandler');} header("Content-type: application/x-javascript"); ?>

This will test if the zlib extension is loaded, and if it is, output buffering will be started.

Add this code with no white space at the bottom of the file.

<?php if(extension_loaded('zlib')){ob_end_flush();}?>

This will test if the zlib extension is loaded and, if it is, sends the compressed data to the browser.

Save the file and exit your editor. Now you need to create (or edit) the file called .htaccess and add the following lines:

<Files prototype.js>
ForceType application/x-httpd-php
</Files>

This instructs Apache to treat the Javascript file as a PHP file, thus running our compression code. Save the file and exit. Now, you need to upload the modified files to your site. Once that is done, you need to check that your site still works correctly, type in the direct URL of the file you modified, and ensure there is no PHP code at the top. If there is, then the changes to .htaccess were not correct.

If your site works okay, and there is no PHP code in the javascript file, the final test is online. Head over to a GZip Page tester, such as the GIDNetwork Page Tester and type in the URL to the file.

If everything is working properly, you should see a screen like this:

Now, all you need to do is repeat the process for each file you wish to compress. Don't forget to change the Content-Type section of the PHP code according to the file being compressed. See below for the common MIME types to use.

• HTML - text/html
• PHP - text/html
• XHTML - application/xhtml+xml
• JavaScript - application/x-javascript
• CSS StyleSheet - text/css

Now, wait a few days and look at your logs again, and you should see a decrease in bandwidth.