jQuery 3.0 Final Released

On June 9, 2016, the official release of jQuery 3.0 took place, which has been in development since October 2014. Our goal was to create a lighter and faster version of jQuery (of course, with backward compatibility). We removed all the old crutches for IE and used some more modern web APIs where necessary. jQuery 3.0 is a continuation of the 2.x branch, but with some changes that have long been wanted. Branches like 1.12 and 2.2 will receive critical patches for some time, but you should not expect new functionality in them. jQuery 3.0 is the future of jQuery. If you suddenly need IE 6-8 support, you can continue to use the version 1.12 release.




We expect that upgrading your projects to version 3.0 will not cause much trouble. Yes, there are several critical changes that justify the main feature of the version, and we hope that this will not greatly affect the update process.

To help upgrade, we've added a new upgrade guide to version 3.0, and the jQuery Migrate 3.0 plugin will help you identify compatibility issues in your code. Your opinion about the changes will help us a lot and therefore, please try it on your current project.

Of course, jQuery 3.0 files are available from the CDN:

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

can also be installed via npm :

npm install [email protected]

In addition, we have a jQuery Migrate 3.0 release. We strongly recommend using it to troubleshoot issues related to changed functionality in jQuery 3.0. Files are also available in CDN:

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

And in npm:

npm install [email protected]

For more information on upgrading jQuery 1.x and jQuery 2.x branches to jQuery 3.0 with the jQuery Migrate plugin, read the jQuery Migrate 1.4.1 post .

Thin assembly

Finally, we have added something new to this release. If you do not need AJAX, or prefer to use one of the many libraries focused on AJAX requests, and it is also easier to use a combination of CSS with class manipulations for the entire animation, then along with the usual version of jQuery, which includes AJAX and effect modules, we release A "thin" version that does not contain them. In general, this code is considered obsolete and we just threw it away (just kidding). Nowadays, the size of jQuery rarely worries about performance, but the thin version is as much as 6 KB smaller than usual - 23.6k versus 30k.



These files are also available on the CDN:

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

This assembly was created using a custom API assembly that allows you to include or exclude any modules. For more information, read jQuery README .

JQuery UI and jQuery Mobile compatible

Most of the methods will work, but there are a few points that we will implement in the near future in jQuery UI and jQuery Mobile. If you find a problem, keep in mind that it can already be published earlier and fixed using jQuery Migrate 3.0 plugin . Expect releases soon.

Big changes

This article provides only the main points of new features, improvements and fixes. You can read more in the upgrade instructions . A complete list of fixed issues is available in our bug tracker on GitHub . If you read the blog on 3.0.0-rc1, the functions below have not changed.

jQuery.Deferred is now Promises / A + compatible

JQuery.Deferred objects have been updated for compatibility with Promises / A + and ES2015 Promises and verified using the Promises / A + Compliance Test Suite . This means that .then () needs to make some significant changes. Of course, you can restore any use of .then () by renaming it to .pipe () , now considered obsolete (and having the same signature).

1 fix

Added a callback function (callback) to .then ( ). Previously, you had to throw an exception to execute the callback function. In this case, any data based on the return of the response will never return as exceptions.

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 fix

Previously, when registering “first callback”, they received an error and all subsequent code stopped working. Neither the second callback nor the third were registered. A new, compatible with the callback standards, if successful, returns true . err is the failure value of the first callback.

The state of the Deferred permission created by .then () is now monitored by exception callbacks that return values ​​and non-thenable. In previous versions, rejection values ​​were returned .

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");

Earlier, the log contained “rejection callback 1 value1”, “rejection callback 2 value2”, and “rejection callback 3 undefined”.

A method compatible with the new standards will record logs of the form: “rejection callback 1 value1”, “success callback 2 value2 ″, and“ rejection callback 3 [object Error] ”.

3 fix

A callback is always called asynchronously, even if Deferred was returned. Previously, they were synchronous.

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

Previously, the log contained “success callback” then “after binding”. Now it will look like “after binding” and then “success callback”.

ATTENTION! While caught exceptions have advantages for debugging in the browser, this is a much more “friendly” method to investigate the cause of callbacks. Keep in mind that this always makes you responsible for adding at least one callback for failure processing. Otherwise, errors may go unnoticed ...

We have developed a Deferreds compatible plugin for help in debugging - Promises / A +. If you do not see the necessary error information in the console to determine its source, check if the jQuery Deferred Reporter Plugin plugin is installed .

jQuery.when has also been updated to accept any thenable object that includes its own Promise objects.
https://github.com/jquery/jquery/issues/1722
https://github.com/jquery/jquery/issues/2102

Added .catch () to Deferreds

The catch () method has been added as an alias for .then (null, fn) .
https://github.com/jquery/jquery/issues/2102

In case of errors, the main thing is not to be silent

Perhaps you have ever wondered the crazy question “what kind of window shift?”.

In the past, jQuery sometimes tried to return such something instead of error handling. In this particular case, asks to shift the window until it is in the position {top: 0, left: 0} . With jQuery 3.0, such cases will throw errors, ignoring these crazy answers.
https://github.com/jquery/jquery/issues/1784

Removed obsolete event aliases

.load , .unload and .error are deleted. Use .on () instead .
https://github.com/jquery/jquery/issues/2286

Now using animation

requestAnimationFrame

On platforms that support the requestAnimationFrame API, which is now everywhere except IE <= 9 and Android <4.4, jQuery will now use it to implement animations. This should increase the smoothness of rendering, and reduce the amount of processor time spent, therefore, saving battery power on portable devices.

Using requestAnimationFrame a few years ago would create serious compatibility issues.with existing code, so we had to exclude it at that time. Now there is the possibility of pausing the execution of the animation at a time when the browser tab "goes" out of sight. For example, switching to another tab. Nevertheless, any animation-dependent code always works in almost real time and creates an unrealistic load.

Massive boosters for some jQuery custom selectors

Thanks to the detective work of Paul Irish from Google, we were able to identify some cases where we missed a lot of work with custom selectors such as : visible was used multiple times in the same document. This rare case allows you to speed up the work up to 17 times!

Keep in mind that even with this improvement, using the : visible and : hidden selectors can be costly because they depend on the browser, which determines whether it is visible on the page right now. This may require, in the worst case, a full recalculation of CSS and page layout! At that time, while we did not impede their use, we recommend that you check your pages for performance problems.

These changes actually turned it into 1.12 / 2.2, but we would like to improve it in jQuery 3.0.
https://github.com/jquery/jquery/issues/2042

As mentioned above, the upgrade guide is now available to anyone who wants to use this version. In addition to the basic upgrade instructions, it also includes a more detailed description of the remaining changes.

Changelog