jQuery 4.0: первое крупное обновление за 10 лет

hannadev

После почти десяти лет разработки jQuery наконец выпустили версию 4.0 - обновление, которое меняет всё. Это не просто заплатка, а полная модернизация библиотеки: отказ от старых браузеров, переход на ES-модули и удаление кучи устаревшего кода, который давно уже не нужен. Если вы ещё работаете с jQuery в своих проектах, пора разобраться, что изменилось и почему это важно.

В этой статье разберём главные нюансы jQuery 4.0, посмотрим на реальные последствия для ваших проектов и поймём, нужно ли срочно обновляться или можно подождать. Спойлер: тянуть бесконечно не получится, но и паниковать не стоит.

Конец поддержки старых браузеров: наконец-то

Первая большая новость - jQuery официально прощается с Internet Explorer 10 и всеми браузерами, которые вышли из моды ещё в 2015 году. Удалены старые версии Edge (до перехода на Chromium), древние iOS и Android браузеры. IE11 пока ещё живёт, но его дни сочтены - в jQuery 5 его точно выкинут.

Зачем это нужно? Просто потому, что поддержка легаси-браузеров - это огромный груз. Разработчикам приходилось писать кучу костылей, обходных путей и ненужных проверок совместимости. Код становился сложнее, размер библиотеки больше, а прирост производительности минимален. Когда вы убираете всё это, jQuery сразу становится легче и быстрее.

Основной вывод: если ваш проект ещё поддерживает IE10 или старые мобильные браузеры, это ваша проблема, а не jQuery. Нужно честно оценить, действительно ли это необходимо. Скорее всего, это легаси от десять лет назад.

ES Modules: jQuery наконец вырос

Вторая крупная перемена - jQuery переписали на ES Modules вместо старого AMD-формата. Что это значит на практике? Теперь исходный код jQuery можно импортировать как обычный модуль, без RequireJS или других обходных решений. Библиотека работает со всеми современными бандлерами: Webpack, Vite, Rollup и другими.

Это упрощает разработку в несколько раз. Вместо сложных конфигов можно просто сделать import $ from 'jquery' и всё работает. jQuery также сохранил поддержку UMD-сборок, поэтому старый код, который подключает jQuery через <script> тег, продолжит работать. Миграция на ES Modules в package.json позволяет инструментам сборки выбирать правильный формат в зависимости от среды.

Добавилась также возможность использовать <script type="module"> напрямую в браузере, что открывает новые возможности для небольших проектов, которым не нужен сложный сборщик.

Удалены устаревшие API: чистота и лёгкость

В jQuery 4.0 выкинули целый набор методов, которые были костылями для кросс-браузерной совместимости. Теперь все это есть в нативном JavaScript:

jQuery.isArray - вместо этого используй встроенный Array.isArray()
jQuery.trim - замени на встроенный String.prototype.trim()
jQuery.parseJSON - теперь это просто JSON.parse()
jQuery.now - вместо этого используй Date.now()
Callbacks и Deferred - в slim-сборке удалены в пользу нативных Promise

Это не просто удаление для красоты. Каждый удалённый API - это меньше кода, который jQuery должна отправлять в браузер пользователя. После минификации и gzip-сжатия библиотека заметно стройнее. Если вам нужны эти функции, используйте нативные браузерные API - они быстрее и уже в памяти.

Так же изменилось поведение с CSS. jQuery больше не добавляет “px” автоматически к числовым значениям почти везде. Если вы устанавливаете CSS-свойство, пишите единицы явно.

Безопасность: Trusted Types и защита от XSS

В jQuery 4.0 добавлена поддержка Trusted Types - это встроенный в браузер механизм, который помогает защищаться от XSS-атак. Когда включена строгая Content Security Policy (CSP), jQuery теперь может передавать HTML-контент в виде объектов TrustedHTML вместо обычных строк.

Что это даёт? Ваш код становится безопаснее по умолчанию. Если кто-то в продакшене попытается вкинуть вредоносный скрипт через пользовательский ввод, браузер просто не позволит его выполнить. Это особенно важно для больших приложений, где пользовательские данные могут попасть в DOM.

Таже изменилось как загружаются скрипты через $.ajax. Теперь для выполнения скрипта нужно явно указать dataType: "script". Это звучит как усложнение, но на деле это снижает риск случайного выполнения вредоносного кода, который пришёл от третьей стороны.

События фокуса: соответствие стандартам W3C

Порядок срабатывания событий focus, blur, focusin и focusout теперь соответствует актуальной спецификации W3C. Раньше jQuery переопределял этот порядок для совместимости со старыми браузерами.

В большинстве проектов это изменение незаметно. Но если в вашем коде есть сложная логика с обработкой фокуса - валидация форм, маски ввода, горячие клавиши - нужно протестировать, что всё работает как ожидается. Обычно всё в порядке, но лучше проверить.

Slim-сборка стала совсем лёгкой

джиКуэри предлагает две версии: полную и slim. Slim-версия всегда была легче, потому что в ней не было AJAX, анимаций и некоторых внутренних компонентов. В версии 4.0 slim стала ещё легче - удалены модули Deferreds, Callbacks и Queue в пользу нативных Promise.

Если ваш проект использует jQuery только для манипулирования DOM и работает с современными браузерами, slim-версия - это ваш выбор. Она совсем маленькая и покрывает 90% потребностей обычного фронтенда. Асинхронный код всегда можно написать с использованием встроенных Promise и async/await.

Что ломается при обновлении: главные points

При переходе с jQuery 3.x на 4.0 нужно ожидать некоторые breaking changes. Вот что может сломаться:

AJAX: JSON больше не преобразуется в JSONP автоматически - нужно явно указать dataType
Scripts: Скрипты через $.ajax не выполняются без dataType: “script”
toggleClass: Сигнатура метода toggleClass( Boolean ) удалена
CSS px: jQuery больше не добавляет “px” к числовым значениям автоматически
Array methods: Удалены недокументированные методы массива

Добрая новость: для большинства проектов эти изменения не критичны. Но нужно протестировать, особенно если вы активно используете AJAX или работаете с динамическими стилями.

Как подготовиться к обновлению

Если решили обновиться на jQuery 4.0, вот примерный план действий:

Создайте ветку для обновления - не делайте это напрямую в продакшене
Обновите jQuery до 4.0.0 через npm или скачайте с официального сайта
Подключите jQuery Migrate 4.x в dev-версии - это инструмент, который показывает все использования deprecated API
Откройте консоль браузера и смотрите предупреждения JQMIGRATE
Пройдитесь по критичным местам: формы, валидация, AJAX-запросы, обработка событий фокуса
Протестируйте всё - особенно старые части кода, которые давно не трогали
Обновите зависимости - убедитесь, что плагины jQuery, которые вы используете, совместимы с версией 4.0

Основной момент: jQuery Migrate помогает найти проблемы, но это не волшебство. Нужна тщательная работа и тестирование.

Когда jQuery 5 и что будет дальше

В jQuery 4 IE11 ещё поддерживается, но это последний вздох. В следующем крупном релизе (jQuery 5) IE11 точно удалят. После этого jQuery сможет использовать ещё больше современных возможностей JavaScript.

Также ясно, что jQuery продолжит движение в направлении модерна - полный отказ от костылей, дальнейшее сокращение размера, лучшая интеграция с современными инструментами. Если вы новичок в веб-разработке, не имеет смысла учить jQuery с нуля - лучше сразу идти на React, Vue или Svelte. Но для поддержки существующих проектов jQuery остаётся полезным инструментом.

Больше чем просто обновление кода

jQuery 4.0 - это сигнал того, что веб-платформа сильно изменилась за последние десять лет. То, что было необходимо для совместимости, теперь встроено в браузеры. jQuery вместо того чтобы пытаться быть universal solution для всех, нашёл свою нишу - это удобная обёртка над DOM API для проектов, которые не готовы полностью переехать на современные фреймворки. И это честный подход.

Обновление потребует времени и внимательности, но оно того стоит. Код станет чище, проекты легче, а безопасность выше. Главное - не спешить, протестировать всё как следует и не игнорировать предупреждения jQuery Migrate.