Reduce Wordpress Bandwidth Usage
I have recently discovered a method by which I can reduce my overall monthly bandwidth for this website by 500MB.
I have recently discovered a method by which I can reduce my overall monthly bandwidth for this website by 500MB. Using the same technique I have reduced the bandwidth on another of my sites by 3500GB. I will now share with you how I was able to do this, with very little effort and only minimal php knowledge. In fact, all you really need to do is copy and paste a few lines! Its that easy.
As well as reducing bandwidth (and saving bandwidth costs!) it will also 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 your 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 will have to speak with your provider to get it enabled. Don't forget to delete the file when your 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 a one month period, for one site:
- prototype.js (24205 accesses) - 945 MB
- effects.js (24025 accesses) - 377 MB
- header.jpg (22470 accesses) - 252 MB
- lightbox.js (24035 accesses) - 244 MB
- style.css (24190 accesses) - 133 MB
We have to note that an access isn't necessarily a download. The browser could just be getting the header of the file to see if its 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 almost 99% of browsers, and if it isn't supported then they just get the normal uncompressed version.
I am going to 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}/wp-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 white space before this code otherwise it will not work. Please make a backup copy of any file you change, just 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, start output buffering.
And at the very bottom of the file, no white space after, add this code:
<?php if(extension_loaded('zlib')){ob_end_flush();}?>
This will test if the zlib extension is loaded and if it is, send 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 your site still works correctly, type in the direct URL of the file you modified and make sure that there is no php code at the top. If there is, then the changes to .htaccess were not correct.
If your site works ok, and there is no php code in the javascript file, then 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 different 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 have a look at your logs again, and you should see a decrease in bandwidth.
