Running straight out of the box, Shopp will store any product images that you upload in the database rather than as regular files. There’s method in the madness here – the idea is that even a novice user can upload product images without fear of problems such as file permission errors rearing their ugly head.
On the other hand, this approach can have a negative impact on the site’s performance. You can of course switch to file based storage but if you don’t discover this option straight away then there is a good chance that a large chunk of your product images will already be tucked away in the database with no means of extracting them back into regular files. Meanwhile, image requests follow this sort of flow:
- Instead of being served directly by the web server, product images have to pass through an extra layer – the Shopp Image Server
- The Shopp Image Server connects to the database, searches for and retrieves the requested image
- … And then sends it back down the line to the web browser
If we could at least eliminate the extra database work, and better yet facilitate direct access to the images, we could be looking at a real performance advantage. Enter Shopp Image Tools, which tries to solve this problem in as user-friendly a way as is possible, helping to free all of your product images from their database-table prison, setting them up as regular files.
Once installed you will be able to access Shopp Image Tools through the aptly named Image Tools menu option, located in the Shopp settings menu. There isn’t a great deal to it – click on Run Conversion Tool to start the conversion process, and click on Enable Direct Mode to try and minimize calls to the Shopp Image Server.
So what’s Direct Mode then? Well, one of the other benefits of the Shopp Image Server is on-the-fly resizing of product images. Of course it would be wasteful to resize them every single time and so a cache of resized images is maintained.
When Direct Mode is enabled, the output of the product image template tags is intercepted. If a cached version of the image already exists then the Shopp Image Server URL is replaced with a direct URL that will allow the web server to access it directly – meaning the image can be served quickly without any need for the Shopp Image Server, PHP or establishing a database connection.
It’s good for your page speed and good for the environment.
One other aspect of Direct Mode is that it replaces clear PNG calls. Completely transparent PNGs are used in Shopp product galleries as an aid to nice layouts. For some reason, unless I am mistaken, they are never cached and are instead generated dynamically each time they are requested.
It’s possible that this also facilitates some amount of backwards compatibility with older browsers – however it does seem slightly wasteful since the generated image element can be stretched to fit simply by adding width and height attributes (which Shopp already does). So, what Shopp Image Tools does here is provide a direct URL for a single pixel, transparent PNG. Just be aware this could be a headache if you have a user base who rely on elderly web browsers.
- Always back-up before you do anything and remember that a back-up is useless if you don’t know how to restore it. You should of course configure file-based storage via the Shopp System Settings admin page first of all.
- I can’t offer any proof that this is good for the environment, but it seems reasonable to assume that if every Shopp installation used methods like these then something like a football field sized area of the rain forest would be saved from oblivion annually.