前回(「JavaScriptの動作を軽くするための工夫」)は,JavaScriptの体感速度を上げるために開発されている様々な工夫についてみてきました。今回も引き続き,JavaScriptとサービスの使い勝手について考えてみます。今回取り上げるのは,ほかのサイトに埋め込まれて利用されるJavaScriptに関する話題です。

 「ほかのサイトに埋め込まれて利用されるJavaScript」というのは,例えばブログパーツやウィジェットなどで使われている,「ページにこのJavaScriptを埋め込めば,この機能が簡単に貼り付けられますよ」というタイプのものです。

 前回紹介したRead/WriteWebの記事「JavaScriptがウェブを遅くする--今できる緩和策を考える」でも,主に触れられているのは,ウィジェットに関するものでした。

 ここで述べられていることは,JavaScriptを使ったブログパーツやウィジェットを作る場合は,「他のサイトで実行される」ことを前提に,お行儀のよく迷惑をかけないコードを書こう,ということです。そしてその方法として,「読み込み中に実行されるコードの量を最小限にする」とか「URLを変えてリクエストを負荷分散する」といった提案がなされています。

 ブログパーツ(やウィジェット)は,ページの中においてメインコンテンツになることはあまりありません。にもかかわらず,ページのロード時間のほとんどがブログパーツの読み込みや初期化の処理にとられてしまったり,あまつさえ,ブログパーツがエラーを起こしたり,サーバーとの通信がうまくいかずにページのロードがそこでストップしてしまったり,といったことが起こってしまったら本末転倒です。

 そのため,ページの読み込みや表示のほか,サイト本来の情報やサービス,機能の提供を邪魔する挙動はできるだけ避け,迷惑をかけないようにすることは非常に重要です。Read/WriteWebの記事「JavaScriptがウェブを遅くする--今できる緩和策を考える」で述べられていることに気をつけるのは,本当に重要だと思います。

 ただ一つ気になったのは,この記事でなされている「標準ライブラリを使う」という提案です。これについては,ちょっと自分は違う意見を持っていたので,今回取り上げることにしました。

ライブラリの使用の是非

 prototype.jsjQueryなど,現在たくさんのJavaScript汎用ライブラリの開発が進んでいます。それらは,JavaScriptが標準では備えていない機能を提供し,JavaScriptの最大の問題であるブラウザ間の互換性の問題をかなり解決してくれます。こうしたライブラリの登場や進化は,JavaScriptによる開発の難易度を大きく下げてくれており,すごく便利です。

 Read/WriteWebの記事では,そうした汎用ライブラリの使用が推奨されています。その理由として,以下のように書かれています

 JavaScriptは問題が起こりやすいため,おそらく最悪なのは,車輪の再発明だ。Javaとは違って,標準ライブラリは存在しないが,prototypeのように実質的に標準になったようなものはある。ライブラリは,システムの落とし穴を知っていて理解の深い,経験を積んだ人たちによって書かれているため,そのコードを再利用することはよい考えだ。

 確かにその通りで,JavaScriptのブラウザ互換性の低さは,開発者を悩ませる大きな問題です。JavaScriptでプログラムを書いていると,このブラウザで動かない,とか,あのブラウザで動かない,というトラブルを解決するためにいろいろやらなければならず,辟易することがよくあります。何かのバグを直したら,Firefoxでは動くのに,Internet Explorerで動作しなくなってしまい,それを修正するのにさらに一苦労,なんてことも頻繁に起こります。

 JavaScriptのライブラリは,こうしたブラウザ互換性の問題を解決することも,大きな目的の一つとしていますから,たいていの問題は解決してくれるようになっています(ちなみに,MochiKitのコード内には,そこかしこにInternet Explorerへの悪口が書かれて,ライブラリ開発者の苦労がしのばれます)。

 自分ですべてのコードを書いたら,特定のブラウザでは正しく動かない,といった問題が発生する危険性が常につきまといますし,チェックにも時間がかかりますよね。ですから,そうした問題を回避するために,ライブラリを利用するというのは,¥確かに納得のいく理由であるとは思います。

 実際に,ブログパーツやウィジェットで,こうしたライブラリを読み込むものも見かけます。例えば,Diggの情報を表示すDigg Widgetでは,jQueryを内部的に読み込んでいます。

図1●Digg Widget
図1●Digg Widget

 Digg Widgetで指定されているJavaScriptを見ると,まず先頭でjQueryが呼び出されているのがわかります。

document.write('<script type="text/javascript" src="http://digg.com/js/jquery.js"></script>');
document.write('<script type="text/javascript" src="http://digg.com/js/jquery-dom.js"></script>');

 これ以外にも,prototype.jsを読み込むブログパーツなどもあります。しかし筆者は,ブログパーツやウィジェットでは特に,こうした汎用ライブラリを使うのは問題もあるのではないか,と思っています

 その理由は以下の3つです。

  • サイズが大きく読み込みに時間がかかる
  • 必要以上に処理が複雑になっている
  • 環境を汚染する

 以下に,一つひとつ考えていきましょう。

この先は会員の登録が必要です。今なら有料会員(月額プラン)は12月末まで無料!

日経 xTECHには有料記事(有料会員向けまたは定期購読者向け)、無料記事(登録会員向け)、フリー記事(誰でも閲覧可能)があります。有料記事でも、登録会員向け配信期間は登録会員への登録が必要な場合があります。有料会員と登録会員に関するFAQはこちら