jQuery 3.0 / jQuery Compat 3.0 alpha がリリースされたので調べてみた
マッドマックス怒りのデスロードが面白すぎたのでアベンジャーズを見に行けてないminamiです。
先日jQuery 3.0とjQuery Compat 3.0 のalphaバージョンがリリースされたので内容を調べてみました。
jQuery 3.0 / jQuery Compat 3.0 alpha
jQuery 久々のメジャーアップデートです。今回のアップデートでjQuery2.x系はjQuery3.0に、レガシーブラウザ対応のjQUery1.x系はjQuery Compat3.0 になりました。
主な変更点を見ていきます。
.show(),.hide()メソッドの変更
地味ですが大きな変更です。
- .hide() したjQueryオブジェクトにはCSSのdisplay: none がセットされ、.show() されるとその値がクリアになる。jQuery3.0 からはCSS側でdisplay: none が設定されている要素に.show() してもCSSを上書きはしてくれない
- .slideDown() や .fadeIn()も同様に、CSS側でdisplay: noneされたオブジェクトに実行しても表示されない
- 初期状態でdisplay: noneされた要素は非表示用のclassを.addClass() / .removeClass(） して制御するのがよい
- .ready() の中で.hide() した要素は.show() で表示することができる
- CSS側でdisplay: none した要素を表示させたい場合は.css("display","block") などで対応する
いままでは.show() した要素にはデフォルトのCSS側でセットしたdisplayの値を上書きするようになっており、 その部分を制御する処理が煩雑になりすぎ、パフォーマンスにも影響を与えていたようです。
（メディアクエリによってdisplayの値が変わるパターンも増えたし、そもそも要素によって違うdisplayの値に対応しなければならない）
.show(),.hide() をシンプルな形にすることでパフォーマンス向上を計るようですが、開発者もこの仕様変更による影響は少なくないことを承知しているのでalpha リリースで出すことで効果を確認したいようです。
.data()がHTML5のデータセットに近い実装に
jQuery.DeferredがPromises/A+仕様と互換性を持つように
JavaScript標準のPromise/A+ と互換性を持つようになりました。ネイティブのプロミスオブジェクトも$.Deferredで扱えるようになるんですね。
.width(),.height(),.css('width'),.css('height')が小数点以下の値を返すように。
上記メソッドの値は整数に丸めて返されていましたが、小数点以下の数値を返すようになりました。
非推奨イベントエイリアスが削除
さすがにあまり見なくなりましたが、.load, .unload, and .errorなどのイベントエイリアスがついになくなったようです。
イベントのバインドは.on()メソッドで。
requestAnimationFrameが復活
jQuery 1.6で実装され1.6.3で削除されたrequestAnimationFrame が戻ってきました。以前はパフォーマンスの問題からサポートを断念したようですが今回はどうでしょうか。
.unwrap() メソッドが引数を取るように
以前は引数を取らず親要素を削除していましたが、どの親要素を削除するかの引数を取ることできるようです。
いくつかのカスタムセレクタの大幅なスピードアップ
:visible や:hidden のようなカスタムセレクタの取得が大幅に高速化。
まとめ
jQuery 3.0 alpha の主な変更点を調べてみました。まだalpha版ですが、HTML5やECMAScript6との互換性を考えた作りになっていっているようですね。今後も注目したいです。
