今回はAjax(エイジャックス)を取り上げます。Web 2.0の代表的な技術として取り上げられ、一世を風靡(ふうび)したAjax。皆さんも“Ajax”という言葉自体は知っていると思います。
Ajaxを使ったサイトといえば、Googleマップなどが有名ですね。AjaxはGoogleマップによって世に知れわたったといっても過言ではないと思います。
*** 一部省略されたコンテンツがあります。PC版でご覧ください。 ***
しかし、何が得意で、どんなことがすごいのか? どんな技術を使っているのか?……などなどについてあなたは説明できますか? そのあたりを中心に解説をしていこうと思います。
Ajaxを、その誕生からひもとく
Ajaxを理解するには、その誕生を知ることが第一歩です。
■Ajax発祥の地はいずこ?
「Ajax」発祥の地は、コンサルティング会社を経営するJesse James Garrett氏が、2005年2月18日に投稿した「Ajax: A New Approach to Web Applications」(Ajax Webアプリケーションへの新しいアプローチ)というエントリーです。
このエントリーは話題を呼び、Ajaxという単語がアメリカで使われるようになり、日本にやって来ました。
■Ajaxの定義
では、Ajaxとは何なのか? 彼のブログで、以下のようにAjaxを定義しています。
- standards-based presentation using XHTML and CSS
(XHTMLとCSSを使った標準規格のプレゼンテーション) - dynamic display and interaction using the Document Object Model
(ドキュメント・オブジェクト・モデル(DOM)を使ったダイナミックな表示と相互のやりとり) - data interchange and manipulation using XML and XSLT
(XMLとXSLTを使用してデータ変換と操作) - asynchronous data retrieval using XMLHttpRequest
(XMLHttpRequestを利用した非同期なデータの検索) - and JavaScript binding everything together
(そして、JavaScriptがそれらを一緒にしてしまう)
うーん、分かる人には分かるかもしれませんが、初心者にはまったく意味が分かりませんね。ここでは、重要な単語が出ているので、それだけ押さえておけば大丈夫です。「DOM」「XML」「XMLHttpRequest」「非同期処理」「JavaScript」。これらのキーワードがAjaxと密接な関係があるようです。
ちなみに、Ajaxは略語で、正式名称は「Asynchronous JavaScript + XML」となります。Asynchronousは「非同期」という意味ですが、上記で挙げた単語がたくさん入っていますね。
彼のブログは、多くの人に読まれた結果、Ajaxとは何なのか? たくさんの質問が来ました。それらの質問に対する回答を「Ajax Q & A」として、2005年3月13日に追記しました。以下に紹介するQ&Aは、Ajaxを理解するに当たってとても分かりやすいものなので、取り上げてみました。
質問
Adaptive Path社(※)は、Ajaxのコンポーネットや商標登録を販売しているのですか? どこからダウンロードできるのですか?
※Adaptive Path社はJesse James Garrett氏の会社
回答
Ajaxはダウンロードして使うものではありません。ある種の技術を用いた、Webアプリケーションの構造の考え方、つまりAjaxは1つのアプローチです。また、Adaptive Path社は決して「Ajax」という名前を独占しません
Ajaxについてよく知らない人は、AjaxをJavaやRuby、Perl、VBなどと同様に、「Ajaxはインストールして環境を構築して使用するもの」と認識している人がいるかもしれません。が、実はAjaxはそんなプログラムではなく、1つのアプローチ方法なのです。
先ほど、「DOM」「XML」「JavaScript」といった単語が出てきましたが、Ajaxはこれらの技術を組み合わせた“方法”なのです。このように、既存のテクニックを使っているので、Ajaxはよく「新しくて古い技術」といわれるのです。
■なぜ“Ajax”という名前が付いたのか?
余談になりますが、なぜ、彼は「Ajax」という単語を生み出したかというと、「DOM」「XML」「JavaScript」を使ったWebアプリケーションのアプローチを毎回毎回「DOMやXML、JavaScriptを使った〜」というのが面倒くさいので、うまくひと言でいうために案出しました。
ちなみに、Jesse James Garrett氏のエントリーは日本の有志によって全文が翻訳されています。興味がある人は、ぜひチェックしてみましょう。
次ページでは、Ajaxの具体的なアプリケーションを見ながら、過去のアプリケーションとどう違うのか? について解説します。
Copyright © ITmedia, Inc. All Rights Reserved.