Image caching in Tridion

One of the most effective ways to improve your website’s performance is to implement image caching. Without caching, every visitor downloads the same image every time they request a page. This means unnecessary load on your server and unnecessarily slow page load times for your audience. It also means search engines will take longer to index your site.

Google and Yahoo recommend setting the cache time to a year or more but this begs the question: if you need to update a file, how do you ensure that visitors who have a cached copy get the new version?

The most straightforward way to do this is change the filename of the image and change the image tag on the page so it points to the new file. Visitors to the updated page will see the new image even if they have the old one in their cache.

This seems like alot of effort…unless you happen to have a versioned content management system like SDL Tridion.

By default, Tridion publishes images to an /images folder via the AddBinary() function (PublishBinary() in earlier versions).

/images/myphoto_tcm9-12345.jpg

As seen here, traditionally the published filename is constructed from the image filename and the Component ID. Every time the file is republished the latest version replaces it on the file system.

However, behind the scenes Tridion stores the version number of the Component so it’s fairly trivial to fetch this from the object model and append it to the filename, like so:

/images/myphoto_tcm9-12345_v3.jpg

This way, every time the image Component is changed, a new version of the image will be published out to the web server. It means you have multiple copies of the file on the server, but it’s far better to sacrifice a little disk space in order to save a huge amount of bandwidth.

Exception for existing sites

Existing Tridion-powered sites may have a very large /images folder which contains all kinds of assets – setting a long cache time on this folder would make things very difficult. All of a sudden every binary file served out would be cached for a year with no way to expire the files.

To implement this kind of caching on a site that is already live, create a new folder under /images called /cache

www.mysite.com/images/cache/

Leave your existing /images folder alone and set the caching on the new folder. Then amend your AddBinary() code to publish images into the /cache folder instead.

Sorted.