Как удалить ассеты с отсутствующих страниц в WordPress для оптимизации загрузки

Почему важно удалять ненужные CSS и JS файлы с неиспользуемых страниц

Большинство тем и плагинов WordPress подключают свои стили и скрипты на все страницы сайта без исключения. В итоге на страницах, где эти файлы не нужны, происходит лишняя загрузка ресурсов. Это негативно сказывается на скорости загрузки, показателях Core Web Vitals и общем пользовательском опыте.

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

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

Как определить, какие ассеты грузятся на страницах сайта

Для начала нужно понять, какие CSS и JS файлы загружаются на разных страницах. Для этого можно:

• Открыть страницу и в инструментах разработчика браузера (Chrome DevTools) перейти на вкладку Network — отфильтровать по CSS и JS.
• Использовать плагины типа Clearfy Pro, которые показывают список подключаемых скриптов и стилей.
• Применить сервисы для аудита производительности (PageSpeed Insights, GTmetrix), где часто указываются неиспользуемые CSS и JS.

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

Удаление ассетов вручную через хук wp_enqueue_scripts

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

Пример функции для удаления стиля и скрипта на всех страницах, кроме страницы с ID 42:

function wpnotes_dequeue_assets() {
    if ( !is_page(42) ) {
        wp_dequeue_style('plugin-style-handle');
        wp_dequeue_script('plugin-script-handle');
    }
}
add_action('wp_enqueue_scripts', 'wpnotes_dequeue_assets', 100);

Здесь plugin-style-handle и plugin-script-handle — регистрозависимые идентификаторы подключаемых файлов, которые нужно узнать из кода темы или плагина.

Для сложных условий можно использовать функции is_single(), is_category(), is_front_page() и другие условные теги WordPress, чтобы точечно отключать ассеты.

Пример: отключение плагина слайдера на всех страницах, кроме главной

function wpnotes_conditional_dequeue() {
    if ( !is_front_page() ) {
        wp_dequeue_style('slider-style');
        wp_dequeue_script('slider-script');
    }
}
add_action('wp_enqueue_scripts', 'wpnotes_conditional_dequeue', 100);

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

Использование плагинов для удобного отключения ассетов

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

• Asset CleanUp — позволяет отключать ресурсы на отдельных страницах через визуальный интерфейс.
• Perfmatters — платное решение с расширенными функциями по оптимизации, включая управление скриптами.
• Clearfy Pro — не только оптимизация, но и улучшение SEO, с возможностью отключать ненужные скрипты и стили.

Пример использования Asset CleanUp:

1. Установите и активируйте плагин.

2. Откройте страницу или запись в админке.

3. В мета-боксе Asset CleanUp увидите список всех подключенных CSS и JS.

4. Отметьте, какие файлы отключить для этой страницы.

Это самый простой способ без правок кода.

Автоматизация отключения ассетов с помощью кода и плагинов

Можно комбинировать подходы: использовать плагин для базового контроля и дополнять функцию в functions.php для более тонкой настройки.

Например, добавить фильтр для отключения WooCommerce скриптов на страницах без магазина:

function wpnotes_disable_woocommerce_assets() {
    if ( !is_woocommerce() && !is_cart() && !is_checkout() ) {
        wp_dequeue_style('woocommerce-general');
        wp_dequeue_script('woocommerce');
    }
}
add_action('wp_enqueue_scripts', 'wpnotes_disable_woocommerce_assets', 99);

Так вы уберете лишнюю нагрузку, если у вас на сайте есть WooCommerce, но магазин используется не на всех страницах.

Частые ошибки и как их избежать

Удаление ассетов — мощный инструмент, но требует аккуратности:

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

Выводы и рекомендации

Оптимизация загрузки CSS и JS — важный этап для ускорения WordPress сайта. Удаление ассетов с отсутствующих страниц уменьшает время загрузки и повышает удобство пользователей.

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

Если хотите профессиональное решение, обратите внимание на Clearfy Pro — он поможет не только с отключением ассетов, но и с другими аспектами оптимизации.