Как оптимизировать WordPress сайт, если на нем тысячи картинок

Полезные советы

Узнайте как заметно освободить дисковое пространство на вашем сервере и сделать работу с большим количеством изображений в WordPress более легкой.

Сейчас на нашем сайте хранится более 8 тысяч скриншотов шаблонов WordPress, раньше для каждого такого изображения создавался набор миниатюр различных размеров — три по-умолчанию + 3 кастомных размера, что занимало почти все дисковое пространство, а если размер для какой-то миниатюры нужно было изменить, регенерация всех изображений занимала сутки, или же вовсе замирала на определенном проценте, ведь это 48 тысяч изображений!

Данные шаги заметно освободили дисковое пространство на сервере, а управление картинками стало более удобным.

  1. Отключение автоматической генерации некоторых размеров при загрузки изображения в библиотеку.
  2. Удаление с диска тех размеров изображений, которые не используются в большинстве случаев.
  3. Подключение плагина, который единоразово генерирует изображение в случае его запроса на сайте, если изображение заданного размера еще не создано.
  4. Оптимизация оставшихся изображений.

Рассмотрим все шаги.

1. Отключение автоматической генерации изображений некоторых размеров при загрузки изображения в библиотеку

На нашем сайте для каждого шаблона есть около 6 скриншотов, но только 1 скриншот используется в качестве избранного изображения, и только для него нужно два кастомных размера, зарегистрированных в нашей теме. Именно для этих кастомных размеров мы отключили автоматическую генерацию при загрузки картинки в библиотеку мультимедиа с помощью такого снипета:

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');

Вам необходимо заменить ‘mytheme_large_square’ и ‘mytheme_medium_vertical’ на название вашего размера изображений, найти названия используемых изображений обычно можно в functions.php вашей темы.

Выглядят эти строки примерно так:

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

Таким же образом вы можете отключить генерацию миниатюр для плагинов, если знаете нужные название размеров.

Не рекомендуем отключать автоматическую генерацию для стандартных размеров thumbnail, medium, large, поскольку именно эти размеры изображений обычно используют для вставки в запись, thumbnail — используется для предпросмотра в библиотеке изображений.

2. Удаление с диска тех размеров изображений, которые не используются в большинстве случаев

Если вам необходимо удалить уже сгенерированные миниатюры, вы можете воспользоваться несколькими плагинами.

Thumbnail Cleaner

Плагин подойдет в том случае, если у вас немного картинок. Он очищает все размеры картинок, которые затем необходимо регенерировать. Может использоваться в связке с плагином Regenerate Thumbnails, предназначенным для регенерации всех миниатюр сразу, но в нашем случае у нас другая задача — нам нужно генерировать размеры выборочно.

Optimize Images Resizing

Преимущества этого плагина в том, что он не трогает стандартные изображения thumbnail, medium, large, и довольно быстро удаляет очень большое количество картинок.

Этот же плагин может генерировать нужный размер миниатюр “на лету”, в том случае, если пользователю понадобилась это изображение на сайте. Затем это изображение хранится, так же, как если бы оно было сгенерировано стандартными плагинами регенерации.

Для нашего сайта он не подошел, поскольку не смог генерировать изображения стандартных размеров, которые опрометчиво были удалены ранее.

Image Regenerate & Select Crop

Плагин позволяет удалить выбранный размер изображений, а также указать размеры, для которых не требуется автоматическая генерация при загрузке в библиотеку (если вы боитесь выполнять шаг 1, редактируя код темы). Этот же плагин может подсказать названия размеров изображений, которые создают плагины. Например, вы можете воспользоваться им для очистки избранных размеров изображений, получить названия изображений для отключения автоматической генерации через код темы, а сам плагин затем отключить.

Также плагин Image Regenerate & Select Crop может полностью регенерировать один размер изображений, например, в случае удаления размера large, который использовался для вставки в текст статьи. Также вы можете выбрать нужную позицию для обрезки изображений.

Процесс полной регенерации может занять очень много времени, особенно если у вас много картинок, поэтому рекомендуем не очищать размеры изображений необдуманно.

3. Подключение плагина, который единоразово генерирует изображение в случае его запроса на сайте, если изображение заданного размера еще не создано

Для этой цели мы используем плагин OTF Regenerate Thumbnails. Он регенерирует изображения, только когда они запрашиваются на сайте. Действие происходит автоматически если размер изменился в настройках медиа-файлов, или вы переключились на тему, в которой используются новые размеры изображений.

Изображения будут сгенерированы “на лету”, если для их показа на сайте использовались эти функции:

  • wp_get_attachment_image_src
  • wp_get_attachment_image
  • the_post_thumbnail
  • get_the_post_thumbnail.

Если же изображения определенного размера вставляются в текст, вам необходимо регенерировать все картинки для этого размера.

В нашем случае, после очистки стандартных размеров изображений (чего делать не рекомендуем), плагин не генерировал стандартный размер при отображении на сайте через the_post_thumbnail, пока мы не поменяли размер в настройках Медиа, не сохранили настройки и не вернули нужный нам размер, сохранив настройки еще раз.

Вы также можете использовать упомянутый ранее Optimize Images Resizing, если он вам подходит. Например, если вам нравится возможность очищения всех кастомных размеров сразу и из генерация на лету, но при этом вы не удаляете и не изменяете стандартные размеры.

4. Оптимизация оставшихся изображений

После того, как вы избавились от гигабайт ненужных изображений, вы можете оптимизировать оставшиеся, уменьшив их вес, что не только увеличит скорость их загрузки для ваших посетителей, но и освободит дополнительное дисковое пространство.

Рекомендуем плагин EWWW Image Optimizer. С ним вы можете оптимизировать как .jpg, так и .png изображения. По умолчанию, плагин оптимизирует изображения без потери качества. Также вы можете настроить сжатие с небольшой потерей качества, но со значительным уменьшением веса изображения.

Поскольку теперь картинок у вас меньше, плагину будет меньше работы, он оптимизирует их быстрее и с меньшей нагрузкой на сервер.