Как удалить зависимости от jQuery в теме Hueman WordPress для ускорения загрузки

Почему стоит избавиться от jQuery в теме Hueman

Тема Hueman активно использует jQuery для различных визуальных эффектов и интерактивных элементов. Однако в современных условиях, когда стандартом де-факто становится нативный JavaScript (ES6+) и минимизация внешних зависимостей, jQuery становится «тяжёлым» грузом, который замедляет загрузку страниц и влияет на показатели Core Web Vitals. Особенно это заметно на мобильных устройствах с низкой скоростью интернета.

Удаление jQuery из темы Hueman помогает:

• Сократить количество HTTP-запросов и общий вес страницы.
• Улучшить время первой отрисовки (First Contentful Paint).
• Снизить вероятность конфликтов с плагинами, использующими современные JS-библиотеки.

Диагностика: как понять, что jQuery загружается и тормозит сайт

Для диагностики используйте инструменты разработчика браузера и онлайн-сервисы:

• Chrome DevTools > Network: фильтруйте по JS и найдите jquery.js или похожие файлы.
• Chrome DevTools > Performance: смотрите продолжительность загрузки скриптов и время выполнения.
• PageSpeed Insights: в отчёте будет указано, что jQuery блокирует рендеринг и увеличивает время загрузки.

В теме Hueman jQuery подключается через стандартный enqueue в functions.php или файлах темы, а также может подтягиваться плагинами.

Пошаговое удаление jQuery из темы Hueman

1. Отключение стандартного подключения jQuery

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

function hueman_remove_jquery() {
    if (!is_admin()) {
        wp_deregister_script('jquery');
        wp_dequeue_script('jquery');
    }
}
add_action('wp_enqueue_scripts', 'hueman_remove_jquery', 100);

Этот код отключит загрузку jQuery на фронтенде.

2. Замена jQuery-скриптов темы на нативный JS

В теме Hueman некоторые скрипты завязаны на jQuery (например, слайдеры, меню). Их нужно переписать или заменить на аналоги без jQuery. Вот пример замены простого jQuery-кода с кликом на элемент:

// Было на jQuery
jQuery(document).ready(function($) {
    $('.menu-toggle').click(function() {
        $('.menu').toggleClass('active');
    });
});

// Стало на чистом JS
document.addEventListener('DOMContentLoaded', () => {
    const toggle = document.querySelector('.menu-toggle');
    const menu = document.querySelector('.menu');
    if (toggle && menu) {
        toggle.addEventListener('click', () => {
            menu.classList.toggle('active');
        });
    }
});

В большинстве случаев простые взаимодействия можно заменить таким образом.

3. Проверка плагинов на загрузку jQuery

Некоторые плагины принудительно подключают jQuery. Чтобы выявить их, используйте:

• wp_dequeue_script('jquery'); — временно отключает jQuery, если страница ломается, значит причина в плагинах.
• Отключайте плагины поочерёдно, чтобы найти виновника.

Для плагинов с использованием jQuery ищите альтернативы без этой зависимости или свяжитесь с разработчиком.

Проверка результата после удаления jQuery

Чтобы убедиться, что jQuery не загружается и сайт работает корректно:

• Откройте инструменты разработчика и в разделе Network убедитесь, что jquery.js отсутствует.
• Проверьте основные функции сайта (меню, слайдеры, формы) — они должны работать без ошибок в консоли.
• Запустите PageSpeed Insights или Lighthouse — показатель скорости должен улучшиться.

Частые ошибки при отключении jQuery и как их исправить

• Функционал ломается, например, меню не открывается: перепишите зависимые скрипты на чистый JS, как показано выше.
• Ошибка в консоли «$ is not defined» или «jQuery is not defined»: значит где-то остался jQuery-зависимый код, ищите и заменяйте.
• Плагин требует jQuery: используйте альтернативные плагины без jQuery или рассмотрите возможность оставить jQuery только для админки.

Практические советы по безопасности и производительности

• Удаляйте jQuery только на тех страницах, где это безопасно — например, на публичной части сайта, а в админке оставляйте.
• Используйте нативный JavaScript с ES6+ для лучшей поддержки и меньшего веса скриптов.
• Кэшируйте и минимизируйте свои кастомные JS-файлы для сокращения времени загрузки.
• Если нужно подключать сторонние библиотеки, выбирайте современные, легковесные аналоги, которые не требуют jQuery.

Сравнение вариантов отключения jQuery в теме Hueman