jQuery 3.0 が正式リリース、通常の Web サイト制作で利用するなら軽量版 「Slim build (スリムビルド)」 が便利

jQuery 3.0 の正式版がリリースされました。次バージョンからはバージョン番号を統一して 3.0 にすると発表されてから 1年半後、やっとの正式リリース。Ajax モジュールなどを省いた軽量版 「スリムビルド」 も提供されています。

jQuery米国時間の 6月 9日付けで、jQuery 公式サイトにてアナウンスされましたが、jQuery 3.0 の正式版がリリースされました。

2014年の 10月に jQuery 公式 Blog に投稿された記事 (参考エントリー) で、次期リリースから現状の jQuery 2.x 系の後継を 「jQuery 3.0」、1.x 系の後継を 「jQuery Compat 3.0」 と名称変更した上で、今までメジャーバージョン番号が異なっていた 2つの jQuery を、jQuery 3.x に統一すると発表されていましたが、それから約 1年半を経て、今回ついに jQuery 3.0 の正式リリースとなりました。

ちなみに 「jQuery Compat 3.0」 については IE8 のサポートが Microsoft によって打ち切られたことで (参考エントリー)、リリース候補版の公開時になかったことになって消滅しています。

ブラウザサポート

jQuery 3.0 のブラウザサポート状況は下記の通り。詳しくは 「Browser Support : jQuery Core 3.0 Upgrade Guide」 に記載されています。

  • IE9 以降
  • Chrome、Edge、Firefox、Safari の最新版とそのひとつ前のバージョン
  • Opera の最新版
  • iOS 7 以上で稼働する iOS版 Safari
  • Android 4.0 以降

ということで、IE8 以前は動作しませんから注意しましょう。といってももう開発元のサポートが切れているブラウザですので、通常は気にする必要ないと思いますが (どうしてもサポートが必要な場合は、jQuery 1.12 の最新版を利用することで引き続き対応が可能です)。

その他、細かい変更点や移行に際しての注意点、方法など、「jQuery Core 3.0 Upgrade Guide」 に記載されていますので、目を通しておくとよいと思います。英語は無理という方は、下記に日本語訳を公開してくれている方がいますのでそちらを参考に。

スリムビルド

今回の正式版リリースで興味深いのは、カスタムビルド機能を利用して、Ajax モジュールと effects モジュール、さらに現時点で非推奨となっている API を除外した 「スリムビルド (Slim build)」 が提供されていることです。

Slim build

Finally, we've added something new to this release. Sometimes you don't need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for all your web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we're releasing a "slim" version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version - 23.6k vs 30k. These files are also available in the npm package and on the CDN:

jQuery 3.0 Final Released! : Official jQuery Blog から引用

Web アプリケーションは別として、通常の Web ページ、Web サイトで jQuery を使用する場合、Ajax 関連の API は使わないことが多いと思いますので、こちらを選択するのもよいかもしれません。通常版の 30KB に対して、スリムビルドは約 6KB 軽い、23.6KB のファイルサイズになっています。

CDN を利用する場合

CDN から jQuery を読み込む場合は 「jQuery CDN」 に加えて下記の外部 CDN が利用できます。

例えば jQuery CDN から jQuery 3.0 を読み込む場合は、下記のような記述が可能です。

<!-- 通常版(Minify) -->
<script src="https://code.jquery.com/jquery-3.0.0.min.js"></script>
<!-- スリムビルド版(Minify) -->
<script src="https://code.jquery.com/jquery-3.0.0.slim.min.js"></script>

この記事を書いている時点で確認した限りでは、Microsoft CDN 以外ですでに 3.0 が配信開始されているようです。例えば Google Hosted Libraries なら下記のように読み込むことができます。

<!-- 通常版(Minify) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<!-- スリムビルド版(Minify) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.slim.min.js"></script>

関連エントリー