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.
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?