Ajax（Asynchronous JavaScript + XML）を用いたRIA技術紹介

Ajaxの特徴／定義

AjaxはAsynchronous（非同期）JavaScript＋XMLの略で、インフォメーションアーキテクトであるJesseJamesGarrett氏によって名づけられました。Garrett氏は2005年2月18日に「Ajax:A New Approach to Web Applications」（Ajax：Webアプリケーション開発の新しいアプローチ）というエッセイの中でAjaxを次のように定義しています。

• XHTMLとCSSを用いたWeb標準に基づくプレゼンテーション
• DOMによるダイナミックな表示と相互作用
• XMLとXSLTによるデータの変換や操作
• XML Http Requestによるデータの非同期的な取得
• それらをJavaScriptによって結びつける

Ajaxはそれ自身が特定の技術要素を表した言葉ではなく、既存技術の組み合わせによる新しい方向性を表した言葉です。

従来のWebアプリケーションは、入力フォームの送信ボタンによってサーバ側へリクエストを送信し、サーバ側で所定の処理を行った後、HTMLのレスポンスを返すというのが一般的でした。そのため、リクエストの度に必ず画面遷移が発生し、ユーザを待たせる結果となっていました。しかし、Ajaxアプリケーションでは様々なイベントをトリガーとしてリクエストを送信することができるため、必ずしも画面遷移を必要とせず、即時に画面を更新することが可能となります。

従来のWebアプリケーションモデルとAjaxアプリケーションモデルの比較

Ajaxの最大の特徴は、非同期通信で必要なときに必要なだけデータを取得できる点にあります。非同期通信はJavaScriptの組み込みオブジェクトであるXML Http Requestにより実現され、ユーザを待たせることなくデータを提供することができます。また、これまでWebアプリケーションでは難しいと考えられていたデスクトップアプリケーションのようなインタラクションも実現可能となりました。

同期通信と非同期通信の比較

最近の動向／事例

Google MapsやGoogle Suggestの先進性が話題となり、Ajaxは瞬く間に浸透しました。GoogleはAjaxの先進企業としてその他にもGmailやGoogle Calendar等のサービスにAjaxを積極的に採用し、その実用性を証明しました。

今やあらゆるサイトにAjaxが組み込まれ、その利用のされ方も様々です。代表的な例としては：

• Sony：タブやサムネイル表示等のUIパーツを部分的に取り入れ情報整理にAjax活用。
  

  SonyJapan
• MYKITA：Flashのようなアニメーション効果をAjaxで実現。
  

  MYKITA
• Yahoo!pipes／Netvibes：サイト全体をAjaxで構築し、OSやデスクトップアプリケーションのようなUIを実現。
  

  Yahoo!pipes

Ajaxライブラリ／フレームワーク

Ajaxが登場した当初、ブラウザ間の互換性やクロスドメインの制約といった問題もあり、またJavaScriptの開発言語としての未成熟さも相まり、Ajaxアプリケーションを開発するのが容易ではありませんでした。しかし現在では、それらの問題を解消するライブラリやAjaxが標準で組み込まれた開発ツールが登場する等、Ajaxアプリケーションを開発する環境も整い、敷居は下がりつつあります。特に代表的なライブラリやフレームワークを表にまとめていますので、開発の際の参考にしてみてください。

最近では企業内システムにもAjaxが採用されるケースが多くなってきましたが、適用範囲については十分な検討が必要であることも分かって来ています。

最後にJesseJames Garrett氏の言葉を引用します。

「Ajaxアプリケーションを創造することにおけるもっとも大きな挑戦は、（中略）Webの限界について我々が知っていると思っていることを忘れ去ること。そして、もっと広く、豊かな可能性に思いを馳せること。それはきっと楽しいことだろう。」