WebP + Nginx + WordPress
WebP — формат сжатия изображений как с потерями, так и без потерь, предложенный компанией Google Inc. в 2010 году. Основан на алгоритме сжатия неподвижных изображений из видеокодека VP8.
Подготовка WordPress
Для автоматической конвертации jpg и png картинок в wordpress будем использовать плагин “WebP Express”. Но сам плагин в не будет создавать дополнительную нагрузку на wordpress, т.к. включать опцию “Alter HTML” мы не будем.
Настройки плагина оставляем дефолтные, включив только конвертацию при загрузке
Запускаем конвертацию картинок
Таким образом, плагин WebP Express используется только для первоначальной конвертации картинок в webp формат и для авто конвертации при загрузки новых картинок.
Selectel — ведущий провайдер облачной инфраструктуры и услуг дата-центров
Компания занимает лидирующие позиции на рынке на рынке выделенных серверов и приватных облаков, и входит в топ-3 крупнейших операторов дата-центров в России.
Результат конвертации: картинки весят в 6 раз меньше
Настройка Nginx
Отредактируем конфиг Nginx
$ sudo nano /etc/nginx/conf.d/wp.conf
...
# WebP Express rules
location ~* ^/?wp-content/.*\.(png|jpe?g)$ {
add_header Vary Accept;
expires 365d;
if ($http_accept !~* "webp"){
break;
}
try_files
/wp-content/webp-express/webp-images/doc-root/$uri.webp
$uri.webp
/wp-content/plugins/webp-express/wod/webp-on-demand.php?xsource=x$request_filename&wp-content=wp-content
;
}
# Route requests for non-existing webps to the converter
location ~* ^/?wp-content/.*\.(png|jpe?g)\.webp$ {
try_files
$uri
/wp-content/plugins/webp-express/wod/webp-realizer.php?xdestination=x$request_filename&wp-content=wp-content
;
}
# WebP Express rules ends
...Проверим на ошибки и перечитаем конфиг
$ sudo nginx -t $ sudo nginx -s reload
Смотрим на результат
Как видно по второму скриншоту, теперь nginx подменяет jpg/png картинки на webp