WordPress по умолчанию загружает множество скриптов и стилей на каждую страницу сайта. Это часто приводит к замедлению загрузки страниц, особенно если вы не используете некоторые из них. В этой статье рассмотрим, как можно эффективно отключать автозагружаемые скрипты и стили, чтобы оптимизировать скорость сайта без ущерба для функционала.
Почему нужно отключать ненужные скрипты и стили в WordPress
Каждый лишний HTTP-запрос увеличивает время загрузки страницы. Автозагружаемые скрипты, например jQuery, emoji-скрипты, dashicons и другие, часто не нужны на фронтенде сайта. Даже если вы не используете стандартные функции, многие темы и плагины подключают эти скрипты по умолчанию.
Отключение ненужных ресурсов позволяет снизить нагрузку на сервер, уменьшить размер страницы и улучшить пользовательский опыт, особенно на мобильных устройствах и медленных соединениях.
Основные скрипты и стили, которые часто можно отключить
Вот список часто загружаемых скриптов и стилей, которые можно отключить, если они не нужны:
- Emoji скрипты и стили – отвечают за отображение эмодзи в старых браузерах.
- Dashicons – иконки админки WordPress, которые редко нужны на фронтенде.
- jQuery Migrate – скрипт для обратной совместимости jQuery, часто не нужен, если тема и плагины обновлены.
- Embed скрипты – для автоматического встраивания контента (например, YouTube или твитов).
- WooCommerce стили – если WooCommerce установлен, но вы не используете их на всех страницах.
Как отключить автозагружаемые скрипты и стили через functions.php
Для отключения ненужных скриптов и стилей можно использовать функцию wp_dequeue_script и wp_dequeue_style. Ниже пример кода для wp-code.ru, который отключает emoji, dashicons и jQuery Migrate на фронтенде:
function wpcode_disable_unnecessary_scripts() {
if (!is_admin()) {
// Отключаем emoji скрипты
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('wp_print_styles', 'print_emoji_styles');
// Отключаем dashicons для неадминов
wp_dequeue_style('dashicons');
// Отключаем jQuery Migrate
wp_deregister_script('jquery');
wp_register_script('jquery', includes_url('/js/jquery/jquery.min.js'), array(), null, true);
// Отключаем embed скрипты
wp_dequeue_script('wp-embed');
}
}
add_action('wp_enqueue_scripts', 'wpcode_disable_unnecessary_scripts', 100);Обратите внимание, что важно проверять работу сайта после отключения, чтобы не нарушить функционал.
Детальное объяснение кода
remove_action('wp_head', 'print_emoji_detection_script', 7); и remove_action('wp_print_styles', 'print_emoji_styles'); удаляют загрузку emoji-скриптов и стилей, которые по умолчанию добавляются в <head>.
wp_dequeue_style('dashicons'); отключает загрузку Dashicons — шрифтовых иконок WordPress, которые нужны только в админке.
wp_deregister_script('jquery'); удаляет стандартный jQuery вместе с jQuery Migrate, а далее мы регистрируем jQuery без миграции, чтобы не потерять зависимости, если они есть.
wp_dequeue_script('wp-embed'); отключает скрипты для автоматического встраивания контента на страницы.
Как отключить стили WooCommerce на не WooCommerce страницах
Если на сайте установлен WooCommerce, но магазин используется только на отдельных страницах, то разумно отключать его стили на всех остальных. Это уменьшит общее количество загружаемых файлов.
function wpcode_disable_woocommerce_styles() {
if (class_exists('WooCommerce')) {
if (!is_woocommerce() && !is_cart() && !is_checkout() && !is_account_page()) {
wp_dequeue_style('woocommerce-general');
wp_dequeue_style('woocommerce-layout');
wp_dequeue_style('woocommerce-smallscreen');
}
}
}
add_action('wp_enqueue_scripts', 'wpcode_disable_woocommerce_styles', 99);Этот код проверяет, являются ли текущие страницы WooCommerce-специфичными, и отключает стили, если нет.
Использование плагинов для управления скриптами и стилями
Если вы предпочитаете не писать код, для управления скриптами и стилями можно использовать плагины:
- Asset CleanUp: Page Speed Booster — позволяет отключать скрипты и стили на уровне страниц и постов.
- WP Rocket — оптимизатор с возможностью отложенной загрузки скриптов и отключения emoji.
- Clearfy Pro — плагин для комплексной оптимизации, включая отключение ненужных скриптов.
Рекомендации по тестированию и отладке
После отключения скриптов обязательно проверьте, что на сайте все работает корректно. Особое внимание уделите следующим моментам:
- Формы и AJAX-запросы.
- Слайдеры и галереи.
- Кнопки и всплывающие окна.
Если какие-то функции перестали работать, найдите, какой скрипт отвечает за них и не отключайте его.
Для отслеживания подключенных скриптов можно использовать расширения браузера, например, Query Monitor или встроенный инспектор сети.
Заключение
Оптимизация загрузки скриптов и стилей — важный шаг для ускорения сайта на WordPress. С помощью простого кода и/или плагинов вы сможете значительно снизить вес страниц и улучшить пользовательский опыт. Используйте приведённые примеры как основу для своих корректировок.