Optimizing a WordPress Site Containing Thousands of Images

Our site contains more than 8,000 screenshots of WordPress themes. Previously, for each of these images, we created a set of thumbnails of various sizes: three default and three custom size, which occupied almost all of the disk space. And if the size of some thumbnails had to be changed, regeneration of all the images took a whole day or completely froze at a certain percentage because it’s 48 thousand pictures we are talking about!

The following steps have significantly increased the drive space available, and image management has become more user-friendly.

1. Disable automatic generation of some sizes when images are uploaded to the library.
2. Remove the image sizes from the disk that are not used in most cases.
3. Activate a plugin which generates an image once when it is requested on the site if there is no image of a given size yet.
4. Optimize the rest of the images.

Let’s have a closer look at all the steps.

1. Disable Automatic Generation of some Sizes When an Image is Uploaded to the Library

Our site has about 6 screenshots for each theme but only 1 screenshot is used as a featured image. This image alone needs two custom sizes registered in our theme. It is for these custom sizes that we have disabled automatic generation when uploading the image to the Media Library using the following snippet:

function mytheme_filter_image_sizes( $sizes) {

	unset( $sizes['mytheme_large_square']);

	unset( $sizes['mytheme_medium_vertical']);

	return $sizes;

}

add_filter('intermediate_image_sizes_advanced', 'mytheme_filter_image_sizes');

You should replace ‘mytheme_large_square’ and ‘mytheme_medium_vertical’ for your image size name. The names of the image sizes used can be normally found in your theme’s functions.php.

These lines look approximately as follows:

add_image_size( ‘mytheme_medium_vertical’, 800, 800, array( 'left', 'top' ) );

You can disable thumbnail generation for plugins in the same way if you know the desired size name.

It is not recommended to disable the automatic generation of the default sizes such as thumbnail, medium, and large since these image sizes are typically used for inserting in the post and thumbnails are used for preview in the Media Library.

2. Remove the Image Sizes from the Disk that are not Used in Most Cases

If you need to delete the thumbnails that are already generated, you can use several plugins.

Thumbnail Cleaner

You can use this plugin if you do not have many images. It cleans all the image sizes that should be further regenerated. It can be used together with the Regenerate Thumbnails plugin designed to regenerate all the thumbnails, but in our case, we have a different challenge — we need to generate some sizes selectively.

Optimize Images Resizing

The advantages of this plugin are the facts that it does not affect the standard thumbnail, medium, and large images and pretty quickly removes a great number of images.

Further, the same plugin can generate the desired thumbnail size “on the fly”, in case the visitors request this image on the site. After that, this image is stored as if it were generated with standard regeneration plugins.

We haven’t chosen it for our site since it could not generate default image sizes that had been removed in a rush earlier.

Image Regenerate & Select Crop

The plugin allows you to delete the selected image size and specify the dimensions that do not require automatic generation when uploading the images to the library (if you would not like to take step 1 for editing the theme code). The same plugin can show the names of image sizes created by plugins. For example, you can use this plugin to clean the selected image sizes, get image names for disabling the automatic generation using the theme’s code, and then disable the plugin.

The Image Regenerate & Select Crop plugin can also fully regenerate one image size, for example, if you removed the ‘large’ size which had been used for inserting into blog posts. You can also select the desired position for image cropping.

The process of full regeneration may take a very long time, especially if you have lots of images, so it is not recommended to clean the image sizes carelessly.

3. Activate a Plugin Which Generates an Image Once When It Is Requested on the Site If There Is No Image of a given Size Yet

We use the OTF Regenerate Thumbnails plugin for this purpose. It only regenerates images when they are requested on the site. This operation is automatic if the size is changed in Media settings or if you switch to a theme that uses new image sizes.

Images will be generated “on the fly” if the following functions were used to display them on the site:

• wp_get_attachment_image_src
• wp_get_attachment_image
• the_post_thumbnail
• get_the_post_thumbnail.

If the images with specific dimensions are inserted into the text, you need to generate all the images for this size.

In our case, after cleaning the standard image sizes (which we do not recommend doing), the plugin was not generating one of the default sizes when displayed on the site through the_post_thumbnail until we changed the size in Media settings, saved the settings, returned the size we needed, and saved the settings once more.

You can also use the above mentioned Optimize Images Resizing if it works for you. For example, if you like the opportunity to clean all the custom sizes at once and generate them on the fly without deleting or changing default image sizes.

4. Optimize the Rest of the Images

After you get rid of gigabytes of images you do not need, you can optimize the rest of the images by reducing their weight, which will not only increase their loading speed for your visitors, but also free up some additional disk space.

We recommend the EWWW Image Optimizer plugin. You can optimize both .jpg and .png images. By default, the plugin optimizes the images without any loss of quality. You can also set compression with little loss of quality but with a significant reduction in the image weight.

Since you have fewer images now, there will be less work for the plugin. It will optimize them faster and without overloading your server.