jQuery 3.0, a new vital recover of jQuery finally got released. The web developer village waited for this critical step given Oct 2014, when a jQuery group began to work on a new vital chronicle adult until now, Jun 2016, when a final release is out.
Where to Start
If we wish to exam how your existent plan works with jQuery 3.0, we can give a try to a jQuery Migrate plugin that identifies harmony issues in your code. You can also take a demeanour into future milestones.
This essay doesn’t cover all a new facilities of jQuery 3.0, usually a some-more engaging ones: softened formula quality, formation of new ECMAScript 6 features, a new API for animations, a new process for evading strings, increasing SVG support, softened async callbacks, softened harmony with manageable sites, and increasing security.
1. Old IE Workarounds Got Removed
One of a categorical goals of a new vital recover was to make it faster and sleeker, therefore a aged hacks and workarounds associated to IE9- got removed. This means if we wish or need to support IE6-8, you’ll have to keep regulating a latest
1.12 release, as even a
2.x array doesn’t have full support for comparison Internet Explorers (IE9-). Check out a records on browser support in a docs.
Note that there are also many deprecated features in jQuery 3. A large accountability of a Upgrade Guide is that a deprecated facilities – as of Jun 2016 – aren’t grouped, so if you’re meddlesome in them, you’ll need to demeanour them adult with your browser’s hunt apparatus (Ctrl+F).
As many browsers upheld by jQuery 3 support strict mode, a new vital recover have been built with this gauge in mind.
There’s one exception: some versions of ASP.NET that – given of a despotic mode – are not concordant with jQuery 3. If you’re concerned with ASP.NET, we can have a demeanour during a sum here in a docs.
Note that a
jQuery 3 uses a requestAnimationFrame() API for behaving animations, creation animations run smoother and faster. The new API is usually used in browsers that support it; for comparison browsers (i.e. IE9) jQuery uses a prior API as a fallback process to arrangement animations.
RequestAnimationFrame has been out for a while, if we are meddlesome in what it knows or given we should use it, CSS Tricks has a good post about it.
The docs helps us know this process softened with a following example:
“For example, if an component on a page has an id of “abc.def” it can't be comparison with
$( "#abc.def" ) given a selector is parsed as “an component with id ‘abc’ that also has a category ‘def’. However, it can be comparison with
$( "#" + $.escapeSelector( "abc.def" ) ).”
I’m not certain how frequently such a box happens, though if we strike into a problem like this, now we have an easy approach to fast repair it.
Unfortunately, jQuery 3 still doesn’t entirely support SVG, though a jQuery methods that manipulate CSS category names, such as
.hasClass(), now can be used to target SVG documents as well. This means we can cgange (add, remove, toggle) or find classes with jQuery in Scalable Vector Graphics, afterwards character a classes with CSS.
In jQuery 3,
Deferred objects have been done concordant with a new Promises/A+ standards. Deferreds are chainable objects that make it probable to create callback queues.
The new underline changes how asynchronous callback functions are executed; Promises concede developers to write asynchronous formula that is closer in proof to synchronous code.
$.when() process provides a approach to execute callback functions. It’s partial of jQuery given chronicle 1.5. It’s a stretchable method; it also works with 0 arguments, and it can accept one or some-more objects as arguments as well.
jQuery 3 changes a approach how arguments of
$.when() are interpreted when they enclose a
$.then() method with that we can pass additional callbacks as arguments to a
In jQuery 3, if we supplement an submit evidence with a
then() process to
$.when(), a evidence will be interpreted as a Promise-compatible “thenable”.
This means that a
$.when process will be means to accept a roomer operation of inputs, such as local ES6 Promises and Bluebird Promises, that creates it probable to write some-more worldly asynchronous callbacks.
In sequence to boost compatibility with manageable design, a formula associated to showing and stealing elements has been updated in jQuery 3.
The new formula respects a
display values of stylesheets whenever it’s possible, that means that CSS manners can dynamically change on events such as device reorientation and window resize.
The docs asserts that a many critical outcome will be:
“As a result, away elements are no longer deliberate hidden unless they have inline
display: none;, and therefore
.toggle() will no longer compute them from connected elements as of jQuery 3.0.”
If we wish to softened know a results of a new show/hide logic, here is an engaging Github discussion about it.
jQuery developers also published a Google Docs table about how a new poise will work in opposite use cases.
In other words, if we wish to govern cross-domain book requests, we must announce this in a settings of these methods.
According to a docs, a new requirement is useful when a “remote site delivers non-script content though after decides to serve a book that has antagonistic intent“. The change doesn’t impact a
$.getScript() method, as it sets a
dataType: "script" choice explicitly.