こんにちは。デザイナーのSUGIYAMAです。
最近ではサイトを実装するのに必要不可欠になってきているJavaScriptですが、
その中でも「jQuery」は重宝され、使う機会も多いと思います。
基本的にはjQueryサイトからライブラリをダウンロードし、任意の場所に配置しリンクするのですが、
様々なバージョンがあるのでバージョンを変更する場合、再度ダウンロードして、配置、リンクすると
結構手間になってきます。その手間を省くため今回はGoogle にホストされている jQuery ファイルを読み込む方法を紹介します。
Google Hosted Libraries とは
Google Hosted Libraries（https://developers.google.com/speed/libraries/）
Google Hosted Libraries はGoogleのCDN（Content Delivery Network）で、jQuery以外にもさまざまなライブラリ（MooTools、Prototypeなど）が多数ホスティングされており、
誰でも無料で利用可能です。
jQuery を利用できる主要なCDN は、Google、Microsoft、jQuery、CDNJS、の4つがあります。
本家のjQueryにもCDNがありますが、GoogleやMicrosoftより遅いといった意見もあるようです。
読み込み
<script src="https://ajax.googleapis.com/ajax/libs/jquery/*バージョンを選択*/jquery.min.js"></script>
読み込みはとても簡単です。1行追加するだけでOKです。
用途や他のプラグインの仕様によって、バージョンを使い分けてください。
以上で完了です。とっても簡単です。
また、Google Hosted Librariesで使われているCDNについても簡単にまとめました。
CDNのお話
CDN とは「Contents Delivery Network（コンテンツデリバリネットワーク）」の略で、コンテンツを配信するために最適化されたネットワークを指します。CDNを使えば、自サーバーにファイルを置かなくても、直接jQueryを引っ張ってくることが可能です。
CDNのメリット
- Googleなど主要なCDNは世界中にアクセスポイントがあり、常に最寄りのポイントから利用可能
- 別サイトで読み込んだGoogleホストのjQueryでも同じURLであればキャッシュが共有される
- jQueryをGoogle側に取りにいくので、自サーバへのアクセスを軽減できる
CDNのデメリット
- インターネット環境に接続していないパソコンなどでは動かない
- 万が一CDNがダウンした場合、読み込みができなくなる
まとめ
簡単に記述できる以外にも、結構メリットもあって、使えるならどんどん使っていきましょう。
CDNに関しては使う人が増えれば増えるほどキャッシュヒットする可能性が高くなり、ダウンロードが必要なのはそのどれか最初にアクセスした1つのページだけで済みます。
ただし、自サーバで完結したいというケースもありますので、使う前に確認しておきましょう。
