To reduce load time of websites - generate image thumbnails on the fly vs. generate on image upload

I have been using timthumb to generate image thumbnails on the fly for my WordPress websites. 1 of of my sites are quite big and it contains lots of images. I've noticed that it takes timthumb quite a bit of time to do its job and my site is very slow now.

To reduce my website's load time, should I generate image thumbnail everytime an image is generated and have it stored in my server (storage is not a problem for me)? Or is it still possible to generate thumbnails on the fly while keeping websites' load time minimal?

I'm implementing Amazon CloudFront to serve images for my website by the way.

Answers


Most sites have a number of set image sizes when they go into production.

If you find yourself in this situation ( i.e. you have two or three main image sizes ) then it makes sense to store those on the server after they've been resized for the first time.

Appreciate that you are worried about space, but you're almost certainly resizing down, not up - meaning that any sized image cache will always be smaller than your high resolution masters.

As for why you should go the stored route, think about the work that you are asking the web server to do on each request. Every resized image is a raster that needs to be loaded, resized, then streamed out as the appropriate content-type. That's fine with one or two images, but on something like a gallery page you'll always hit performance problems.

Compare that with the work involved in a pre-cached thumbnail. First time out, you'll hit that problem. Every subsequent request is just a case of "find a file and serve it".

Take the storage hit if you can. Why make an image to order a million times if it turns out exactly the same each time?


Need Your Help

Multithreading (Stateless Classes)

java multithreading stateless

Apologies for the long code post but am wondering if someone can help with a multithreading question (I am quite new to multi-threading). I am trying to design a facade class to a RESTFUL web servi...

how to change the height of two views (One view shrink and the other expand) using objective c?

objective-c uiview uiviewcontroller

i have two views(A&B) in the same view controller(popOver window) and want to toggle between them, view A is larger than view B, when the popOver window first loads i want view A only to appear...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.