The Best Way to Use TimThumb with a CDN (and Why Amazon S3 Is Not so Good)

TimThumb is no longer supported or maintained.
More information →

Speeding up a websites loading time is so good for so many reasons, so it’s understandable that people want to use a CDN (Content Delivery Network) to serve their images, however in the case of TimThumb there’s a right way and a wrong way. Below I am going to explain how I use a CDN to speed up TimThumb on Binary Moon.

Content Delivery Network?

A CDN or Content Delivery Network, is a method for serving website content. Your content (generally static files such as images, CSS and javascript) get uploaded to the CDN, and it then gets distributed to other servers on the network that are spread all around the world. Then, when a user tries to access a file, the CDN picks the server nearest to the user. This means that the content has less far to travel so the data will arrive in a nice timely fashion. In addition, since CDN’s serve static content, they are optimized for static files, which makes the process quicker still.

Note that technically Amazon S3 is not a true CDN. S3 was designed for content storage. The correct Amazon service to use for content delivery is Amazon CloudFront.

TimThumb and CDN’s

The problems start when you combine TimThumb with a CDN. The most common scenario is that a file is included in a TimThumb url as such (I am using an image I have on Amazon S3 as an example).

../timthumb.php?src=http://binaryjoy.s3.amazonaws.com/webgames/drift-runners/_thumb_100x100.png

On the face of it this looks like it will work great, the image is hosted on Amazon and is being resized by TimThumb. Look closer and it’s not so good. The first time the image is requested the things happen in the following order:

  1. TimThumb loads on your server
  2. TimThumb requests the file from the CDN
  3. TimThumb caches the external file on your server
  4. TimThumb resizes the image
  5. TmThumb saves the cached image on your server

The second time the image is requested the following things happen:

  1. TimThumb loads on your server
  2. TimThumb loads the cached file from your server

Once the file is cached it is served entirely from your server and the CDN is bypassed, making it redundant. So how do we fix this?

TimThumb CDN, a solution

The first thing we need to do is look a little closer at how CDN’s work.

There are 2 ways of getting content onto a CDN. In the case of Amazon S3 (which as mentioned above isn’t a true CDN) you have to upload the files to the server manually. This is called a push server, since you are pushing the content on to the CDN. The second type of server is a pull server. In this case the server waits for a request for some content and, if it doesn’t have it already, pulls it from the original website and then stores it on the CDN.

We want to use a pull server.

The advantage with the pull server is that it doesn’t (always) need to know what the content it is storing is going to be. For instance with TimThumb the server can access the dynamic cropped url, see there is an image, and then store that image.

Here on Binary Moon I have set up a pull server to use cdn.binarymoon.co.uk. If the pull server sees a request to cdn.binarymoon.co.uk then it will check for a stored file, grab the content it needs and then store it for serving later. This means that you can happily make use of TimThumb AND of CDNs.

W3 Total Cache

The easiest way I have found to move your images onto a pull server is using W3 Total Cache. Below is how I configured W3 Total Cache so that it would work with TimThumb.

  1. Download, install and enable the W3 Total Cache Plugin
  2. On the plugins General Settings page scroll down to ‘Content Delivery Network’ settings and then select from the Origin Pull section, either Mirror, or Mirror: NetDNA/ MaxCDN, then hit save.
  3. Go to the Content Delivery Network Settings page, scroll down to the Advanced Settings section, and then add *timthumb.php to the Theme file types to upload: field, and hit save.

A full W3 Total Cache Tutorial would take a lot longer, there’s loads of settings in there, but this should help get you started on the road to creating a site that caches your TimThumb images.

All of the images on Binary Moon are served from a CDN. Currently I am using http://wpcdn.com. For personal usage their prices are very reasonable (less than $10 a month). If you search around you will find there are actually quite a few cdn’s targeted towards bloggers but they have served me pretty well so far.

Check out more articles on TimThumb here.

Let me know what you think on Mastodon, or BlueSky (or Twitter X if you must).

Related Posts

04 Nov 2010

TimThumb Troubleshooting Secrets

I often get asked questions about TimThumb and why it doesn’t work in certain situations. I can generally tell what is wrong with the script within about 60 seconds of being sent a demo url. Below are my top tips...
15 Mar 2012

TimThumb Configurations

As a TimThumb user, making changes to the settings has always been a bit of a pain. It’s possible, of course, but if you make changes – and then want to update the script – then you have to make...
05 Aug 2010

Using TimThumb part 1: Getting Started

TimThumb has always been built with simplicity in mind. However there are a few things it can do that have not been exposed before.Inspired by a comment from RBhavesh I have decided to write a series of posts in which...
11 Oct 2009

How to Make TimThumb Work With WordPress Multisite

TimThumb is a popular image resizing script that was created for Mimbo Pro – but it’s never worked properly with WordPress MU, so I wanted to change that.The reason it doesn’t work is quite simple. Because of the way WordPress...
01 Jul 2014

I No Longer Use TimThumb – Here’s What I do Instead

Last week there was a second exploit found in TimThumb. Thankfully it was no-where near as bad as the first one – but it raised an interesting question of whether TimThumb is even needed anymore.TimThumb was made to be useful...
16 Dec 2010

A New Secret to Increasing Your Page Views

Do you want to increase the page views on your website? Everyone does right? Well this is something I have been spending a lot of time thinking about, and I recently found out something quite surprising.In hindsight I probably shouldn’t...