Отключение «лишних» скриптов и стилей в WordPress без плагинов

Векторная иллюстрация IDE для разработчиков

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

Удаление из очереди на вывод

В репозитории WordPress есть несколько коммерческих плагинов, которые умеют отключать лишние скрипты и стили в зависимости от типа или расположения страницы.

В коробке есть две похожие функции: wp_dequeue_style(), wp_dequeue_script(). С их помощью можно манипулировать очередью глобальной регистрации стилей и скриптов.

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

Функции принимают всего один параметр — это название, которое указано при регистрации. Чтобы найти его проверьте HTML-код в исходном коде страницы, например скрипт подключен так:

<script type="text/javascript" id="example-script-js" src="https://example.com/wp-content/plugins/example-plugin/functions/assets/js/script.js"></script>

А файл стилей, так:

<link rel="stylesheet" id="example-style-css" href="https://example.com/wp-content/themes/example-theme/assets/css/style.css" type="text/css" media="all">

Копируем идентификаторы без стандартных окончаний -js и -css, чтобы использовать их при написании функции:

<?php 

add_action( 'wp_print_scripts', 'dequeue_script_and_stylesheet', 100 );

function dequeue_script_and_stylesheet() {
    wp_dequeue_style( 'example-style' );
    wp_dequeue_script( 'example-script' );
}

?>

Пример из практики

Например, мы решили ускорить загрузку главной страницы и после ее анализа выяснили, что можем отключить скрипт от плагина Expert Review и 2 стиля от темы оформления.

Напишем функцию с проверкой вывода главной страницы:

<?php 

add_action( 'wp_print_scripts', 'dequeue_script_and_stylesheet', 100 );

function dequeue_script_and_stylesheet() {
    if( is_home() || is_front_page() ) {
       wp_dequeue_style( 'theme-style-tags' );
       wp_dequeue_style( 'theme-style-category' );
       wp_dequeue_script( 'expert-review-scripts' );
    }
}

?>

Проверка при регистрации

Это еще один способ управления очередью на вывод. Если вы регистрируете файлы самостоятельно, вы можете ограничить их подключение с помощью проверок:

<?php 

add_action( 'wp_footer', 'add_footer_scripts' );

function add_footer_scripts() {
    // Подключаем стиль везде, кроме страниц
    if( ! is_page() ) {
        wp_enqueue_style( 'example-app', get_template_directory_uri() . '/assets/css/app.min.css', array(), null );
    }
    // Подключаем скрипт везде, кроме категорий
    if( ! is_category() ) {
        wp_enqueue_script( 'jquery-validate', get_template_directory_uri() . '/assets/js/jquery-validate.min.js', array(), null );
    }
}

?>

3 июля 2022