jQuery 4.0: ES-модули и отказ от дублирования

[hannadev]

Спустя почти десять лет после выхода jQuery 3.0 команда разработчиков наконец выпустила долгожданное обновление — jQuery 4.0. Это первый крупный релиз библиотеки, который приносит серьёзные изменения в архитектуру и функциональность. jQuery по-прежнему используется на 70,9% из 10 млн самых посещаемых сайтов в интернете, так что это обновление касается огромного количества проектов.

Основной посыл jQuery 4.0 — избавиться от легаси-кода, который накопился за годы разработки, и привести библиотеку в соответствие с современными веб-стандартами. Разработчики удалили устаревший функционал, который дублирует встроенные возможности браузеров, и переписали исходный код на ES-модули. Давайте разберёмся, что действительно изменилось и почему это важно для вас.

Переход на ES-модули: что это меняет

Одно из ключевых изменений в jQuery 4.0 — полный переход на ECMAScript Modules (ESM). Раньше библиотека использовала AMD-модули и глобальные переменные, что делало интеграцию с современными сборщиками вроде Webpack и Vite не совсем удобной. Теперь jQuery работает как нормальный ES-модуль, и вы можете импортировать её стандартным способом.

Этот переход важен не просто так. Когда вы используете современный сборщик модулей, он может лучше оптимизировать ваш код благодаря tree-shaking — удалению неиспользуемого функционала. Раньше с jQuery это было затруднено из-за архитектуры на основе глобальных переменных. Теперь же сборщик может точно определить, какие части библиотеки вам нужны, и исключить из финального бандла лишнее.

Вот что это дает в практическом плане:

• Лучшая интеграция с Vite, Webpack, Rollup и другими современными инструментами
• Возможность использовать стандартный синтаксис import вместо AMD или глобальных переменных
• Более точная оптимизация благодаря tree-shaking и анализу зависимостей
• Возможность работать с jQuery как с обычным npm-пакетом в современном экосистеме

Удаление устаревших API: отказ от дублирования

Второе большое изменение — это массовое удаление API, которые дублируют встроенные возможности браузеров. jQuery много лет назад был спасением для разработчиков, потому что разные браузеры реализовывали JavaScript по-разному. jQuery скрывал эти различия и предоставлял единый интерфейс.

Но сейчас ситуация изменилась. Современные браузеры подчиняются одним стандартам, и встроенный JavaScript имеет все необходимые функции. Поэтому разработчики jQuery решили убрать дублирующиеся методы и оставить только то, что действительно упрощает жизнь.

Вот какие методы были удалены:

• jQuery.isArray() — вместо этого используйте Array.isArray()
• jQuery.trim() — замените на встроенный String.prototype.trim()
• jQuery.parseJSON() — используйте встроенный JSON.parse()
• jQuery.now() — замените на Date.now()
• Вспомогательные методы для работы с CSS, которые дублируют встроенный API

Кроме того, из прототипа jQuery были удалены методы push, sort и splice, которые создавали путаницу с объектами jQuery. Эти изменения делают код чище и понятнее — вы точно знаете, что используете стандартный API браузера.

Разработчики даже оптимизировали размер библиотеки. Slim-версия (без Ajax и анимации) теперь весит 19,5 КБ в gzip, а полная версия — 27,5 КБ. Это на 3 КБ меньше, чем раньше, и это при всех новых функциях безопасности.

Отказ от поддержки старых браузеров

jQuery 4.0 больше не поддерживает Internet Explorer 10 и более ранние версии, Edge Legacy (версии до перехода на Chromium), а также старые мобильные браузеры. Internet Explorer 11 пока ещё работает, но это последний раз — в jQuery 5.0 поддержка IE 11 будет полностью удалена.

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

Список браузеров, которые больше не поддерживаются:

• Internet Explorer 10 и ниже (окончательно)
• Internet Explorer 11 (поддержка остаётся, но будет удалена в 5.0)
• Edge Legacy (до перехода на Chromium)
• Firefox версии ниже современных
• Очень старые версии iOS и браузера Android

Если вы работаете с устаревшими браузерами, вы можете продолжать использовать jQuery 3.x — она будет получать security-обновления и bug-фиксы.

Улучшения безопасности: Trusted Types и CSP

В jQuery 4.0 добавлена поддержка Trusted Types — это стандарт безопасности, который помогает защитить приложение от XSS-атак. Trusted Types предотвращают небезопасное присваивание HTML-контента через методы вроде innerHTML или eval.

Это особенно важно при использовании Content Security Policy (CSP) — набора правил, которые браузер применяет к скриптам и внешним ресурсам. Когда вы используете Trusted Types вместе с CSP, браузер отказывает в выполнении кода, который потенциально может быть вредоносным.

Добавлена также поддержка модульных скриптов с типом <script type="module"> в поддерживаемых браузерах. Это позволяет использовать jQuery как нормальный ES-модуль в HTML без обёрток и хаков.

Практические преимущества безопасности:

• Браузер автоматически блокирует попытки присвоить опасный HTML-контент
• Лучшая совместимость с политиками Content Security Policy
• Меньше проблем с XSS-уязвимостями при неосторожном использовании jQuery
• Возможность использовать более строгие политики безопасности

Изменения в порядке событий focus/blur

В jQuery 4.0 изменился порядок срабатывания событий focus и blur. Теперь они соответствуют спецификации W3C и совпадают с поведением всех современных браузеров. Раньше jQuery переопределял это поведение по-своему, что могло привести к различиям между jQuery-кодом и чистым JavaScript.

Это значит, что если у вас есть обработчики для событий focus или blur, они могут срабатывать в немного другом порядке. В большинстве случаев это не критично, но стоит проверить, как работает ваш код после обновления.

Как перейти на jQuery 4.0

Хорошая новость в том, что разработчики jQuery обещают, что для большинства проектов переход будет безболезненным. Однако есть несколько вещей, которые стоит проверить:

• Если вы используете методы типа jQuery.isArray(), замените их на встроенные аналоги
• Проверьте обработчики событий focus/blur на предмет возможных изменений в порядке срабатывания
• Если вы используете Ajax, убедитесь, что изменённое поведение подходит вашему коду
• Тестируйте приложение в актуальных версиях браузеров

Для упрощения миграции команда jQuery выпустила специальный плагин, который помогает выявить потенциальные проблемы при переходе с jQuery 3.x на 4.0.

Нужно ли срочно обновляться?

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

Но это не причина, чтобы внедрять jQuery, если вы его ещё не используете. Если вы начинаете новый проект с современным фреймворком вроде React, Vue или Svelte, вам jQuery попросту не нужен. Встроенный JavaScript более чем достаточен для большинства задач.

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