9 июня 2016 года состоялся официальный релиз jQuery 3.0, которая была в разработке с октября 2014 года. Нашей целью было создание более легкой и быстрой версии jQuery (конечно, с обратной совместимостью). Мы удалили все старые костыли для IE и использовали некоторое более современное веб API там, где это необходимо. jQuery 3.0 является продолжением ветки 2.x, но с некоторыми изменениями, которые давно хотели внести. Такие ветки как 1.12 и 2.2 будут получать критические патчи в течение некоторого времени, но ожидать новый функционал в них не стоит. jQuery 3.0 — это будущее jQuery. Если вдруг Вам нужна поддержка IE 6-8, Вы можете продолжать использовать релиз версии 1.12.




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

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

Разумеется, файлы jQuery 3.0 доступны из CDN:

https://code.jquery.com/jquery-3.0.0.js
https://code.jquery.com/jquery-3.0.0.min.js

Также можно установить через npm:

npm install jquery@3.0.0

Кроме того, у нас есть релиз jQuery Migrate 3.0. Мы настоятельно рекомендуем его использовать для устранения проблем, связанных с измененным функционалом в jQuery 3.0. Файлы также доступны в CDN:

https://code.jquery.com/jquery-migrate-3.0.0.js
https://code.jquery.com/jquery-migrate-3.0.0.min.js

И в npm:

npm install jquery-migrate@3.0.0

Для подробной информации об апгрейде веток jQuery 1.x и jQuery 2.x на jQuery 3.0 с плагином jQuery Migrate, читайте пост jQuery Migrate 1.4.1.

Тонкая сборка

Наконец-то мы добавили что-то новое к этому релизу. Если Вам не нужен AJAX, или предпочитаете использовать одну из множества библиотек, ориентированных на AJAX-запросы, а также проще использовать комбинацию CSS с манипуляциями классов для всей анимации, то наряду с обычной версией jQuery, включающей в себя AJAX и модули эффектов, мы выпускаем «тонкую» версию, которая их не содержит. В общем, этот код считается устаревшим и мы просто его выбросили (шутка). В наше время размер jQuery очень редко беспокоит производительность, но тонкая версия на целых 6 Кб меньше обычной — 23.6к против 30к.



Эти файлы также доступны в CDN:

https://code.jquery.com/jquery-3.0.0.slim.js
https://code.jquery.com/jquery-3.0.0.slim.min.js

Эта сборка создана при помощи кастомной сборки API, позволяющей включать или исключать любые модули. Для получения дополнительной информации читайте jQuery README.

Совместимость с jQuery UI и jQuery Mobile

Большинство методов будет работать, но есть несколько моментов, которые мы реализуем в ближайшее время в jQuery UI и jQuery Mobile. Если Вы обнаружили проблему, имейте ввиду, что она может быть уже опубликована раннее и при помощи плагина jQuery Migrate 3.0 устранена. Ожидайте релизов в ближайшее время.

Большие изменения

В этой статье приведены лишь основные моменты новых возможностей, улучшений и исправлений. Более подробно можно прочитать в инструкции по апгрейду. Полный список исправленных проблем доступен в нашем баг-трекере на GitHub. Если Вы читали блог по 3.0.0-rc1, приведенные ниже функции не изменились.

jQuery.Deferred теперь Promises/A+ совместимо

Объекты jQuery.Deferred были обновлены для совместимости с Promises/A+ и ES2015 Promises и проверены при помощи Promises/A+ Compliance Test Suite. Это значит, что в методе .then() необходимо внести несколько существенных изменений. Конечно, можно восстановить любое использование .then() путем переименования в .pipe(), ныне считающимся устаревшим (и имеющим одинаковую сигнатуру).

1 исправление

Добавили в .then() функцию обратного вызова (колбэк). Раньше приходилось вызывать исключение для выполнения функции обратного вызова. При этом, любые данные, опирающиеся на возврате ответа никогда не вернутся в качестве исключений.

Example: uncaught exceptions vs. rejection values


var deferred = jQuery.Deferred();
deferred.then(function() {
  console.log("first callback");
  throw new Error("error in callback");
})
.then(function() {
  console.log("second callback");
}, function(err) {
  console.log("rejection callback", err instanceof Error);
});
deferred.resolve();

2 исправление

Раньше при регистрации «first callback» получали ошибку и весь последующий код прекращал работу. Ни второй «колбэк», ни третий не были зарегистрированы. Новый, совместимый со стандартами «колбэк», в случае успеха возвращает true. err — это значение отказа первого колбэка.

Состояние разрешения Deferred, созданного .then(), сейчас контролируется обратными вызовами-исключениями, возвращающими значения и non-thenable. В предыдущих версия, возвращались rejection значения.

Example: returns from rejection callbacks


var deferred = jQuery.Deferred();
deferred.then(null, function(value) {
  console.log("rejection callback 1", value);
  return "value2";
})
.then(function(value) {
  console.log("success callback 2", value);
  throw new Error("exception value");
}, function(value) {
  console.log("rejection callback 2", value);
})
.then(null, function(value) {
  console.log("rejection callback 3", value);
});
deferred.reject("value1");

Раннее, лог содержал “rejection callback 1 value1”, “rejection callback 2 value2”, and “rejection callback 3 undefined”.

Совместимый с новыми стандартами метод будет записывать логи вида: “rejection callback 1 value1”, “success callback 2 value2?, and “rejection callback 3 [object Error]”.

3 исправление

Колбэк всегда вызывается асинхронно, даже если Deferred был возвращен. Раньше они были синхронными.

Example: async vs sync


var deferred = jQuery.Deferred();
deferred.resolve();
deferred.then(function() {
  console.log("success callback");
});
console.log("after binding");

Раньше, лог содержал “success callback” then “after binding”. Теперь будет иметь вид “after binding” and then “success callback”.

ВНИМАНИЕ! В то время, как пойманные исключения имеют преимущества для отладки в браузере, это гораздо более «дружелюбный» метод, чтобы изучить причину возникновения колбэков. Имейте ввиду, что это всегда налагает на Вас ответственность в добавлении хотя бы одного колбэка для обработки отказов. В противном случае, ошибки могут остаться незамеченными...

Мы разработали совместимый с Deferreds плагин для помощи в дебаге — Promises/A+. Если Вы не видите нужной информации об ошибке в консоли для определения его источника, проверьте установлен ли плагин jQuery Deferred Reporter Plugin.

jQuery.when также был обновлен для принятия любого thenable объекта, который включает в себя собственные объекты Promise.
https://github.com/jquery/jquery/issues/1722
https://github.com/jquery/jquery/issues/2102

Добавлен .catch() в Deferreds

Метод catch() был добавлен в качестве псевдонима для .then(null, fn).
https://github.com/jquery/jquery/issues/2102

В случае ошибок главное не молчать

Возможно, Вы когда-либо задавались сумасшедшим вопросом «что за смещение окна?».

В прошлом, jQuery иногда пыталась вернуть такое нечто вместо обработки ошибок. В данном конкретном случае просит сместить окно до тех пор, пока оно не будет в положении { top: 0, left: 0 }. С помощью jQuery 3.0 такие случаи будут бросать ошибки, игнорируя эти безбашенные ответы.
https://github.com/jquery/jquery/issues/1784

Удалены устаревшие псевдонимы событий

.load, .unload и .error удалены. Вместо этого используйте .on().
https://github.com/jquery/jquery/issues/2286

Теперь с использованием анимации

requestAnimationFrame

На платформах, поддерживающих requestAnimationFrame API, который нынче всюду, кроме IE <= 9 и Android < 4.4, jQuery теперь будет использовать его для реализации анимации. Это должно увеличить плавность отрисовки, и уменьшить количество затраченного процессорного времени, следовательно, экономя заряд батареи на портативных устройствах.

Использование requestAnimationFrame несколько лет назад создало бы серьезные проблемы совместимости с существующим кодом, поэтому мы должны были исключить его в то время. Сейчас существует возможность приостановки выполнения анимации в то время, когда вкладка браузера «выходит» из поля зрения. Например, переключившись на другую вкладку. Тем не менее, любой код, зависящий от анимации, всегда работает практически в режиме реального времени и создает нереальную нагрузку.

Массивные ускорители для некоторых кастомных селекторов jQuery

Благодаря детективным работам Пола Ириш (Paul Irish) из Google, нам удалось определить некоторые случаи, когда мы упускали кучу работы с пользовательскими селекторами как, например, :visible многократно использовался в одном и том же документе. Этот редкий случай позволяет ускорить работу до 17 раз!

Имейте ввиду, что даже с этим улучшением, использование селекторов :visible и :hidden может быть затратным, потому что они зависят от браузера, который и определяет видим ли он сейчас на странице. Это может потребовать, в худшем случае, полный перерасчет CSS и разметки страницы! В то время, пока мы не препятствовали их использованию, рекомендуем проверить свои страницы для обнаружения проблем с производительностью.

Эти изменения фактически превратили его в 1.12/2.2, но мы бы хотели его улучшить в jQuery 3.0.
https://github.com/jquery/jquery/issues/2042

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

Changelog