他の人のプログラムとかネットで調べたりするとjQueryのCDNを読み込むときのURLがいろいろ違くて何が最適解なのかわからなかった
- jQueryのバージョン
- CDNファイルファイルの種類
- CDN提供しているプロバイダ
- プラグインの種類
調べると上の条件とかで違っていたよう
じゃあ何を使えばいいの 
#まずjQueryとは
JavaScriptのライブラリのひとつ
jsコードを簡単に書くことが出来る
利用するにはファイルをダウンロードする方法とCDNを読み込む方法がある
#まずCDNとは
ｺﾝﾃﾝﾂﾃﾞﾘﾊﾞﾘﾈｯﾄﾜｰｸ
インターネット経由でファイルを提供してくれるもの
- ファイルをダウンロードしてサーバにアップロードする手間が省ける
- バージョン変わっても対応が楽
- ブラウザのキャッシュに残っていれば表示速度も速くなる
自分のページじゃなくても他のサイトからCDNでjQueryを読み込んでいれば、ブラウザにキャッシュが残るから、それを再利用することで読み込みを省略できる
#jQueryのバージョン
URLの数字の部分が違うのはバージョンが違っていたから
###jQuery1.x系統
IE8以前のブラウザに対応
古くて重い
現在の最新バージョンは1.12.4
###jQuery2.x系統
IE8以前を切り捨てた
軽い
現在の最新バージョンは2.2.4
###
jQuery3.x系統
2.x系統の一部処理を削いだりして性能向上
使えないプラグインがあるかもだけど、リリースから10年たってるから気にしなくてもよさそう
現在の最新バージョンは3.4.1
#CDNのファイル種類
指定しているファイル名が違うのは種類が違っていたから
###hoge.js
普通に記述されてるファイル
### hoge.min.js
改行、スペースとかを削いで容量を減らしてるファイル
###hoge.min.map
圧縮ファイルのプログラムをデバッグするときに使うらしい
###hoge.slim.(min).js
使える機能を抜粋し、minよりさらに容量が少なくて済むファイル
AnimationやAjax等の機能を省いたらしい
#jQueryCDNの提供元
ドメイン名が違うのは提供しているプロバイダが違っていたから
jQueryの公式ホームページにはStackPatahのCDNが大々的に書かれてて、"その他のCDN"の覧に他4プロバイダのCDNダウンロードページが紹介されてる
-
StackPath CDN
src="https://code.jquery.com/jquery-3.4.1.slim.js" -
Google CDN
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js" -
Mcrosoft CDN
src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.4.1.min.js" -
CDNJS CDN
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js" -
jsDelivr CDN
src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.min.js"
個人の見解だけど、jQueryの使い方とか調べるとGoogleのCDNを使ってる人が多い気がすること、そして公式推奨のStackPathよりもGoogleのCDNの方が応答速度が速いらしいことから私はGoogleの提供してるjQueryを使いたい
#プラグインの種類
jQueryをさらにパッケージ化したもの
###jQuery Migrate
バージョン差異によって発生する問題を解決する為のjQueryプラグイン
###jQuery UI
UIに特化したプラグイン
最初にjQueryの￥も読み込む
ドロップ＆ドラッグやデザインの統一
###jQuery Mobile
モバイルに特化したプラグイン
###jQuery Color
背景色をスムーズに変化させる
jQueryを先に読み込む
###QUnit
jQueryのテスト用
###PEP
モバイルにも対応していてドロップ＆ドラッグができる
#ついでに
万が一CDNが読み込めなかったときにローカルファイルを読み込ませる記述
<script src="読み込むCDN"></script>
<script type="text/javascript">
(window.jQuery || document.write('<script src="代替ローカルファイル"><\/script>'));
</script>