I had a call this week with a client who manages a few WordPress sites. One of the things they do, like me, is backup files. The plugin they chose for their workflow is UpdraftPlus. The client hosts all of their clients’ websites on one server, so storage space has become an issue. Fortunately, I was able to create a simple solution to mitigate the problem by excluding image thumbnails from automated backups.
WordPress Thumbnails
WordPress generates different size thumbnails for every image uploaded from the administration panel. Themes and plugins can add custom image sizes by using the add_image_size function provided by Core. In fact, for every site I audit, one thing I look for is unused image sizes. Each image size requires more server resources in processing and storage, so using them efficiently is smart.1If you can combine image sizes that are close in width/height, that’s another way to reduce the total number.
With responsive sites finally becoming the norm and high-resolution images being used more often2For “Retina” or 2X images used on devices with high pixel densities., many different sizes of same image is a requirement. Also multiple sizes of the same image can be served to the browser using the srcset attribute on the img tag. Invariably, WordPress based sites end up processing a lot of images then saving them to the uploads folder.
Saving Space
Going back to the client’s original issue of minimizing storage space of backups, my obvious focus shifted towards uploaded images. I looked at the image sizes being used by themes and concluded they were OK. I did recommend the site editors pre-process their uploaded images to reduce quality and also use an image compressing plugin.3WP Smush is a good image compressing plugin for WordPress.
Other than reducing the size on disk of each image and its related thumbnails generated by WordPress, we can think about reducing the number of images stored in a backup. The obvious choice here is to simply omit all thumbnails from backups completely.
Updraft does have few settings for which folders and files are included in backups. You can exclude certain content entirely, like plugins, uploads, themes, etc. Individual files and folders can be excluded, including images, but the file match patterns are limited to simple strings with a wildcard. The filename pattern for generated thumbnails at various sizes is more complex than the default exclusion capability. Ergo, we can’t exclude image thumbnails only. What we need is the power of regular expressions and a plugin hook.
Make WordPress Plugins Great Again
Fortunately, UpdraftPlus makes hooks available to developers so they can extend the plugin even further. To me, making hooks available to other developers is what makes a good plugin even better. UpdraftPlus, specifically, provides a simple hook that allows us to filter which files are included in backups. The hook is, not surprisingly, updraftplus_exclude_file. This filter is run against each file while the plugin is compiling a backup. It accepts two parameters, $filter and $file. The former is a passthrough for whether the file had already been filtered out, and the latter is the filename.
WordPress image thumbnails use the following pattern for their filenames: image-name-{width}x{height}.{ext}. So, the regex pattern we need to all exclude image thumbnails is -\d+x\d+\.(?:png|jpe?g|bmp|tiff|gif)$.
To implement this exclusion feature in your WordPress backups from Updraft, I’ve created a very simple plugin. It’s free and available now from the WordPress Plugin Repository. You can install the plugin from your admin by searching for “updraft image thumbnails” or by downloading directly here.
What About Restoration?
Good question. With image thumbnails excluded from backups, the only images included are the full-size originals. However, on the rare occasion a restoration from backup is needed, you can use a plugin like Regenerate Thumbnails to recreate the thumbnails on the server.
Web Developer
I’d been meaning to write something like this myself for a year, and while searching for some example code for the UpdraftPlus filters, found this post of yours. You’ve saved me the work—and nearly 700 MB of thumbnails per backup! Thanks so much!
I was attempting to reduce my sites backup sizes, to ease day to day administration, and from a sustainability perspective. All data transfers and hot storage uses energy – there is a carbon footprint to those backups.
Excluding themes and plugins that I might as well get from WordPress.org in a rare restore situation, helped a lot.
But those many WordPress image variants were a real eyesore. Even with a lean theme, there is at least 6 different variants/thumbnails of each image. Exclude Image Thumbnails From UpdraftPlus Backups did away with those images unnecessary in the backup, making it so much smaller, faster to back up and friendlier to the environment.
Bonus tip: I chose to exclude all webp images from the backup as well. Those are in my case generated from the original jpg or png images, for even speedier load times. I would be able to re-generate those easily if restoring my site. Obviously, you shouldn’t exclude webp if you upload these manually to the media library… Highly recommended.