Кэширование сайта на WordPress с помощью плагина WP Rocket
5 апреля 2021Оптимизация и очистка БД MySQL плагином Advanced Database Cleaner PRO
4 октября 2023В плагине WP Rocket произошли новые изменения — Удаление неиспользуемого CSS из функции «Demo» стала настоятельно рекомендуемой, приоритетной.
Надо иметь ввиду, что WP Rocket (по умолчанию) загружает используемый CSS встроено — над исходным кодом вашего сайта, а не в отдельную таблицу стилей CSS (файл).
Поэтому функция Удалить неиспользуемый CSS работает медленнее, чем на других плагинах.
Но, следует признать, что этот вариант лучше всего подходит для оценки PageSpeed.
Новые изменения в настройках WP Rocket.
Кроме установки в приоритет функции Удаление неиспользуемого CSS, настройки плагина, за прошедшие два с половиной года, не сильно изменились.
Вот некоторые изменения в настройках WP Rocket:
- Появилась развернутая версия опции — Отложить загрузку JavaScript.
- Во вкладке Медиафайлы — LazyLoad (ленивая загрузка) добавился пункт — Enable for CSS background images (Включить для фоновых изображений CSS);
- Включить кэширование WebP переместили в меню — Дополнительные возможности, под названием — Улучшите совместимость браузера для изображений WebP;
- Убрали поддержку пикселя Facebook;
- В меню — Предварительная загрузка, удалили функцию — Активировать предзагрузку на основе Карты сайта. Для этого разработчики предлагают дополнительный плагин — WP Rocket/Only preload URLs in a sitemap.
- В меню — Инструменты, добавили разовую опцию — Оптимизация шрифтов Google.
Функция кеширования в WP Rocket осталась основной и по-прежнему очень сильной.
С ним может поспорить FlyingPress. Плагин платный. В некоторых аспектах даже превосходящий WP Rocket. Но, это только мое мнение. Можете протестировать, если есть необходимость.
Теперь об основном, ради чего я начал писать эту статью, об удалении неиспользованного CSS при загрузке страниц сайта.
Работа функции Удаление неиспользованного CSS.
При активации в плагине WP Rocket функции — Удаление неиспользованного CSS, в обязательном порядке, нужно отключать все настройки с оптимизацией CSS:
- Сжимать стили CSS,
- Оптимизация доставки CSS,
даже если будете использовать другой плагин с этой опцией.
Иначе получите массу предупреждений от плагинов. В итоге — сбой в настройках стилей CSS сайта. Есть исключения, но о них позже.
Не секрет, что многие используют Nulled-версию плагина на своих сайтах. На это, наверное, есть свои причины у каждого. Одна из них — невозможность оплатить лицензионную версию.
В Nulled-версии функция удаления неиспользованного CSS не работает.
Поскольку этот функционал находится на внешнем, по отношению к плагину, сервисе, он предоставляется непосредственно серверами разработчика и работает только в том случае, если вы приобрели лицензию.
Можете проверить папку сайта на своем хостинге:
/public_html/wp-content/cache/used-css/1.
В этой папке генерируется весь неиспользуемый CSS-код. В нелицензионной версии она всегда будет пустой и удалять там будет нечего, хотя в настройках плагина вы будете видеть работающий счетчик.
Некоторые пользователи путают ее с папкой по созданию критического CSS:
/public_html/wp-content/cache/critical-css/1.
При активации вкладки — Оптимизация доставки CSS — Асинхронная загрузка CSS, в ней действительно будет создаваться критический CSS. Эти файлы необходимы сайту и удаляются только при отключении этой опции.
Делегирование функции Удаление неиспользованного CSS.
Однако есть альтернативы делегирования функции Удаление неиспользованного CSS другим плагинам.
Один из них — Perfmatters. Есть русская локализация. Плагин платный. Совместим с плагином WP Rocket.
Если используете плагин Asset CleanUp Pro, в качестве менеджера оптимизации CSS и JavaScript на своем сайте, внимательно проследите, чтобы не было дублирования в настройках.
Смотрите видео-урок — настройка плагина Perfmatters:
Но, хочу предупредить — Perfmatters иногда конфликтует с некоторыми плагинами и темами.
Нужно тестировать. Хотя, плагин получил широкое распространение среди пользователей и о нем хорошие отзывы.
Мне он не подошел из-за некоторых сбоев в стилях темы и конфликте с отдельными плагинами. Но это, чисто специфически.
В депозитарии WordPress.org имеется еще один плагин для удаление неиспользованного CSS и оптимизации JavaScript — это Debloat.
Его я использую на своем основном сайте Sit-Info.
Удаление неиспользуемого CSS с помощью плагина Debloat.
Плагин Debloat предназначен для оптимизации доставки CSS, удаления неиспользуемого CSS, оптимизации доставки с отсрочкой или задержкой загрузки Java-скриптов.
Разработчики предупреждают, что «-это мощный плагин для оптимизации скорости, предназначенный для опытных пользователей. Совместим со всеми темами и плагинами».
Плагин бесплатный. Локализации русского языка нет. Но это не проблема — сейчас в каждом браузере есть переводчик.
Debloat, как нельзя кстати, подошел к моему сайту. Вот замеры скорости загрузки страниц моего сайта на сервисе LOADING.express.
Естественно, перед установкой Debloat, я отключил оптимизацию CSS-стилей в плагине WP Rocket.
Установка и настройка плагина Debloat.
Debloat устанавливается как обычный плагин WordPress.
После активации, в меню Консоли сайта — Настройки — кликните по Debloat:Optimize и перейдете в его настройки.
Меню настроек плагина Debloat состоит из трех вкладок. Здесь я отмечу только те опции, которые активировал у себя на сайте.
Для использования функции удаления неиспользованного CSS требуется отдельный плагин кеширования. У меня это WP Rocket.
Далее идет предупреждение — не включать оптимизацию CSS или JS с помощью другого плагина.
В WP Rocket, как я уже писал, я отключил только оптимизацию CSS.
Исходя из текста предупреждения, запрет на оптимизация CSS или Java-скриптов ресурсами самого плагина не указан.
Заранее скажу, что, протестировав плагин, я отключил оптимизацию CSS в самом плагине Debloat, но оставил ее в Asset CleanUp Pro.
В итоге:
Первая вкладка — Оптимизировать CSS.
Была включена только интеграция плагина в конструктор страниц WPBakery Page Builder.
В меню — Удаление неиспользованного CSS активировал пункты:
- Удалить неиспользуемый CSS;
- Удалить из всех таблиц стилей;
- Удалить CSS включено — Все страницы;
- Отложить загрузку исходного CSS;
- Отложить загрузку оригинала — Все страницы.
Вторая вкладка — Оптимизировать JS.
Активированы опции:
- Отложить Javascript;
- Исключить сценарии. Исходя из потребностей своего сайта, были исключены из отложенной загрузки файлы JS:
- jquery.min.js
- jquery-migrate.min.js
- revslider
- rev_slider
- setREVStartSize
- window.RS_MODULES
- slider
- Включить интеграцию плагинов — WPBakery Page Builder.
В меню — Задержка загрузки JS были активированы:
- Задержка Javascript — до взаимодействия с пользователем;
- Максимальная задержка (в секундах) — 6 (максимально 10).
Третья вкладка — Общие настройки.
Была активирована единственная опция — Отключить обработку для вошедших в систему пользователей с правами администратора.
Если используется отдельный плагин кеширования (в данном случае WP Rocket), вкладка — Статистика кеша — Очистить весь кеш — автоматически отключается.
Вот и все настройки по удалению неиспользуемого CSS с помощью плагина Debloat.
Видео-урок из учебного раздела сайта Centr-Sit-Info Уровень Profi-bizblog:
Теперь немного о сценариях, которые вам, возможно, придется применить для отложенной загрузки Java-скриптов.
Все будет зависеть от Темы (шаблона) WordPress и плагинов, которые вы используете на своем сайте.
Я уже упоминал выше о плагине Perfmatters.
В документации этого плагина, непосредственно на сайте разработчиков, есть статья — Как отложить JavaScript до взаимодействия с пользователем в WordPress.
В подзаголовке — Общие исключения задержки JS, вы найдете различные сценарии отложенной загрузки Java-скриптов для некоторых популярных тем: Astra, Avada, Divi и так далее. Плагинов Elementor и Revolution Slider и других.
В статье — Как удалить неиспользуемый CSS в WordPress, найдете многие сценарии распространенных неиспользуемых исключений CSS.
Все эти сценарии подходят для использования и в плагине Debloat, в различных вариантах.
Все статьи на английском языке — включайте переводчик в браузере.
Вот так, учитывая все новые изменения в настройках плагина WP Rocket и делегируя функцию удаление неиспользуемого CSS с помощью плагина Debloat, можно добиться существенного увеличения скорости загрузки страниц сайта.
Тестируя различные плагины — устанавливая новые и удаляя старые, знаю по своему сайту, в базе данных собирается много мусора.
Что бы не писали разработчики о чистой деинсталляции плагинов.
В следующей статье рассмотрим оптимизацию и очистку базы данных MySQL. Тем более, что я давно обещал.
PS. Все дополнительные материалы, дистрибутивы плагинов, с подробнейшими видео-уроками, можно получить, зарегистрировавшись в Учебном разделе сайта Centr-Sit-Info Уровень Profi-bizblog.
Если возникли вопросы или нужна дополнительная информация? — пишите в комментариях – рад буду помочь.
Подписывайтесь на обновления Sit-Info, чтобы вовремя знать о выходе нового поста.
Не забываете нажать на кнопку «Поделиться» в социальных сетях. Это не реклама.