CDNの活用

通常、サーバ上に設置したjQueryファイルを使用する代わりに、
GoogleやMicrosoftがCDN(Content Delivery Network)にて
提供しているファイルを読み込んで使用することができます。

CDNを利用するメリット

ウェブサイトを高速化できる可能性があるとのこと。
自分のサーバに置いていないものを呼びにいくのに？ と
素人考えで最初は疑問に思いましたが、
多くのユーザーが同じファイルを利用することで、
キャッシュされる可能性が高くなる…ということです。
実際、計測テストを行った方もいらっしゃり、
CDNでロードした方が早いのは確かなようです。

実際の書き方

色々試してみて、結論としては以下の形になりました。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.8.2.min.js"><\/script>')</script>

※1.*系の最終バージョンである1.9.*を使ってもいいんですが、
これまで使ってきたプラグインがちゃんと動くか不安なので、
1.8.2を使っています。一番大きな不安は、.live()が1.9.*では
無くなって、.on()になっているからです。他にもブラウザの判定などで
不安があります。
しばらくプラグインと色々試してみて、問題なければ1.9.*にしていこうと思っています。

なお、「http:」を省略してもいいそうです。

Googleでも省略を推奨されているのですが、
私の職場の環境では、動きませんでした。
プロキシの関係かも？ しれません。
http、またはhttpsを指定したら動きました。
安全に通信を行えそうなので、とりあえずhttpsを指定しています。
省略した場合、httpかhttpsか、考えなくてもいいそうです。

…単純にhttpsの方がいいと思うんですが、
使っているサーバによっては利用できないのでしょうか？
時間があったら調べてみます。
詳しく知っている方で時間がありましたら、コメントお願いいたします。

フォールバック

また、CDNサービスを利用することで高速化のメリットを享受できますが、
万が一、CDNサービスが故障した場合、
jQueryが動かない！　なんて事態で青ざめないよう、
「フォールバック」の処理が2行目に入っています。

フォールバックとは、「代替手段への切替」を意味するとのこと。
jQueryの場合、2行目の指定を行うことで、
CDNからコンテンツを読み込めなかった場合に、
自サーバのjQueryファイルを読み込むことができます。

…CDNの手段って、理屈は分かるんですが、時間があまりない
コーダーにとっては、面倒くさく思えてなりません。
設定も1行増えますしね。
ただ、今回、自分で記事をおこし、自分のソースを作って
実テストすることができました。
次回からはここで紹介したコードを利用することができるので
安心して、コピペで使っていけます。
重要な要素ごとに、自分で総括的な記事を書くのは
長い目でみて非常に有意義だと感じました。
これからも続けていきます。

なお、jQueryのほかに、jQueryUI、Dojo、MooToolsも
CDNで利用することができます。

Google Hosted Libraries – Developer’s Guide