Ajax Webアプリケーション奮闘記～関西温泉マップ～ 200703

Webアプリ開発者向けFireFox拡張機能のまとめサイト

・【特集】Webアプリケーション開発者向け Firefox拡張機能 33+1選 (1) FirefoxでWebアプリの開発を支援 (MYCOMジャーナル)

当ブログでも以前、Webアプリ開発者向けの拡張機能を紹介した。
・Selenium：Webアプリのテストを自動化するツール
・Ajax最強のデバッグツールFireBug 1.0

もちろん、これらは定番の為、上記まとめサイトに掲載されていが、
３３＋１ということで合計４４の拡張機能について紹介されていた。

後々、絶対役に立つのでメモメモ。

PHPのログ出力に関するメモ

「関西温泉マップ」には、組み込んでいないが、これまでのWebアプリケーション開発経験で、ログ出力機能に必要だと思われる機能は以下のものだと思われる。

・ログファイル書き込みの排他処理
・ログデータを無限に吐かせない為にサイクリックな処理
・モード切替。（リリースモードとデバッグモード）
・ログファイルから情報が漏洩しなように、暗号化措置

他にもあるんだろうけど、僕が知っている基本的な機能。
まだ、実装予定は無いが、ログ出力にあたり、下記サイトをメモ。

・【Jakarta/Apacheウォッチ】第6回 Java，.NET，PHP，C++のログ機能を統合へ：ITpro
・Do You PHP? - log4j風ログ出力クラス
・レッツPHP!
・apacheのログに好きな情報を出す方法（PHP編）
・ログ出力クラスPEAR::LOG - PHP(PEAR) | 海は海、風は風 dozo.rgr.jp
・そのまま使えるPHPプログラム独自関数

32社がOpenAjaxに加入

・MS、Googleなど32社がOpenAjaxに加入

[ITmedia エンタープライズ：MS、Googleなど32社がOpenAjaxに加入から引用]

　Ajax推進団体のOpenAjax Allianceは3月20日、米Microsoft、米Googleを含む32社が新たに同団体に加入、参加企業が72社になったと発表した。

Selenium IDEをインストールする

・Selenium IDEのダウンロードページ

2007/3/25時点の最新は、
2007/03/21にリリースされたばかりの0.8.7のインストールを紹介する。
上記、ダウンロードページより0.8.7のバージョンをクリックする。
図１参照。

-図１Selenium IDEダウンロードページ-

図１の手順でダウンロードおよびインストールが終わると図２のように、インストール結果が確認できる。

-図２インストール完了画面-

では、ちょっと遊んでみよう。
図２のように[ツール]-[Selenium IDE]を選択し、下記のダイアログを開く。

このダイアログは放っておいて、
ブラウザからGoogleを開き、当ブログである「Ajax Webアプリケーション奮闘記」を検索してみる。その検索結果から当ブログをクリックする。

そうすると、先ほど開いたダイアログになにやら記録されていくのがわかる。図３参照。

-図３当ブログを検索したときの記録-

この状態で、図３の三角の[再生]ボタンをクリックすると、先ほどの検索手順をそのまま実行してくれる。ちょっと面白い。

このようにユーザの観点からテストを自動的に実行することができる。

・OpenQA: Selenium

日本語ではセレニウムと呼ばれている。一見、外人が使ったかのような名称だが、実は製作者は日本人。

・日本が世界に誇れるテストツールSelenium IDE

SeleniumはWebアプリケーションテストを自動化するツール。不具合を修正した際に、該当箇所のテストを実施するだけでなく回帰テスト（リグレッションテスト）として全テストを再実施することが容易に行えるメリットがある。

Seleniumは以下の３つで構成されている。
・Selenium Core
JavaScriptとDHTMLで作られたSeleniumの中心部。

・Selenium IDE
FireFoxの拡張機能として実装。テストを記録・編集・実施を行う。

・Selenium RC
さまざまなプログラミング言語を用いて、任意のHTTPウェブサイトに対するUIテストを主要なJavascript対応ブラウザにて実施することができるテストツール

以前、ご紹介したFireBugが単体テストでデバッグを行うFireFoxエクステンションであるのに対し、Selenium IDEは結合試験や総合試験を行うのに便利な機能である。

・Ajax最強のデバッグツールFireBug 1.0

[関連リンク]
・Selenium 0.7利用手順書（前編）
・CodeZine：Selenium 0.7利用手順書（後編）（テスト, Webアプリケーション, Selenium）
・CodeZine：Selenium 0.7 TipsとExcelによるDB初期化（テスト, Webアプリケーション, Selenium）
・これはすごい! Web案件必須 Selenium - 人気急上昇中自動テストツール

噴出しが薄れる不具合は直りました。

前回の投稿に記述していた、噴出しが薄れる不具合。

・現在はサーバは復旧しておりますが・・

ローカルにバックアップしている、Webページをサーバにアップしなおすと、
IEでも正常に見れるようになった。

ただ、原因は未だに不明。
アホほど来たコメントスパムの影響？？

現在はサーバは復旧しておりますが・・

先日お騒がせしました、下記の問題。

・不足の自体発生！！

現在はサーバも復活して、地図も表示できるが、
なぜか、Google Maps APIの噴出しが薄れる。

FireFoxで動作を確認すると、問題無いが、
IEで確認すると噴出しが薄れている。

-図１ IEで表示した場合-

-図２ FireFoxで表示した場合-

現在、原因は調査中だが、
早急な対応は行わないことにする。

というワケで、なるべくFireFoxで見てください。

JSEclipse:"ウィザードを開始するときに問題が発生しました。"という不具合

以前紹介した、JSEclipseプラグインで不具合発生。
2006-12-14にリリースされているJSEclipse - version 1.5.3は、まだプレリリースということもありバグが存在するようだ。

[再現方法]
Eclipseを起動し、
[ファイル]-[新規]-[その他]をクリックし、
図１のJSClassを選択し、次へボタンを押下する。

-図１新規ウィザード選択画面-

すると、図２のような不具合が発生する。

-図２ウィザードを開始するときに問題が発生しました-

「選択状態したウィザードは開始できませんでした。
プラグイン com.interaktonline.jseclipse はクラス com.interaktonline.jseclipse.ui.newwizard.JSClass をロードできませんでした。」と表示される。

この現象はAdobe Labsのフォーラムでも質問が上がっており、不具合として報告されている。
・http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?forumid=72&catid=629&threadid=1224131&enterthread=y

上記フォーラムでは、次期リリースで改善予定とのこと。
それまでの対処方法として、以下に記す。

[現時点での対処方法]
Eclipseの[ファイル]-[新規]-[プロジェクト]を選択
図３のように一般のプロジェクトを選択し、次へボタンを押下する。

-図３新規プロジェクト-

次に適当なプロジェクト名を入力して、終了ボタンを押下する。（プロジェクト作成完了）
図４参照。

-図４プロジェクト名入力-

そして、プロジェクトを作成したパスにプロジェクト名のフォルダが追加されているので、そこにJavaSciptファイルを置くか、新規でJavaScriptファイルを作成する。
Eclipseの[ファイル]-[新規]-[ファイル]を選択。適当なファイル名と拡張子に”.js”と付け、終了ボタンを押下する。
図５参照。

-図５新規ファイル作成-

これで、作成したプロジェクトにJSファイルが追加されている。
図６参照。

-図６JSファイル追加-

JSEclipseプラグインを導入してみる。

先日紹介した、Eclipse の JavaScript 開発用のプラグインを導入してみる。
現在、プレリリース版ということで、バグなどの報告もあるようだ。
・JSEclipse：Eclipse の JavaScript 開発用のプラグイン

JSEclipse - version 1.5.3 of 2006-12-14
[動作環境]
Eclipse SDK 3.1以上
Java(JRE)：バージョン1.5以上
空き容量:2MB以上

Eclipseを起動し、[ヘルプ]-[ソフトウェア更新]-[検索およびインストール]を選択する。図１参照

-図１検索およびインストール-

次にインストール／更新画面が表示されるので、
インストールする新規フィーチャーを選択し、次へボタンを押下する。
図２参照。

-図２インストール／更新画面-

インストール画面が表示されるので「新規リモート・サイト」をクリックする。図３参照。

-図３インストール画面-

次に新規更新サイトが表示されるので、以下の情報を入力し、ＯＫボタンをクリックする。名前の欄はわかりやすい名前をつける。図４参照。
URL：http://download.macromedia.com/pub/labs/jseclipse/autoinstall

-図４新規更新サイト-

終了ボタンを押下すると、更新の検索結果が表示される。図５のように表示されていれば次へのボタンを押下する。すると、インストールが開始される。

-図５更新の検索結果-

インストールが完了していれば、[ウィンドウ]-[設定]で、
図６のように確認できる。

-図６JSEclipseプラグイン導入完了-

不足の自体発生！！

私がAjaxを奮闘した成果を表す、「関西温泉マップ」というサイト。

以下のレンタルサーバを利用しており、
６ヶ月単位の契約更新をしている。

そんな更新のことなどすっかり忘れており、
しかも、入金催促のメールにすら目を通していなかった・・。

っていうか、登録しているメールがWebメールなので、
ほとんど見る機会が無いのだけれど・・。

なので、関西温泉マップは現在アクセスできません。

↓こんな感じでメールが届いており、後の祭り・・。

だけど、このサーバのメールは受信できるみたいでやや不思議。
完全に削除されたワケではなさそうだ。

このサーバのユーザログイン画面は開けたので、
一応、そこで入金手続きを敢行。

どうなることやら・・。

一応、関西温泉マップとデータベースの情報はローカル環境にバックアップしてあるので、復元は可能だが、ＳＥＯ対策として使っていたMovable Typeのブログデータはバックアップを取ってないので復元は絶望的だろう。

まー、ここ２、３日怒涛のコメントスパムがあったので、一からMovable Typeを構築しても良かったりするけど。

でも、これは完全にデータが消されていたときの話しだから、
データが残ってることを祈る。

JSEclipse：Eclipse の JavaScript 開発用のプラグイン

・Adobe Labs - JSEclipse

JSEclipseはその名の通り、EclipseのJavaScript用開発プラグイン。
JavaScriptのコーディング補助などを行ってくれる。
Eclipseのプラグインということで導入すれば、補完機能などが便利だ。

[参考サイト]
・【ハウツー】JavaScriptの開発の決定版!? AdobeからJSEclipse (1) JSEclipseとは (MYCOMジャーナル)

Eclipseのダウンロードと日本語化

2007/03/17現在、Eclipse最新バージョンは3.2.2
このバージョンについてダウンロード手順をメモ。
まず、下記サイトにアクセス。

・Eclipse.org home

図１のようにダウンロードページへ移る。

- 図１ Eclipseホームページ -

クリックすると最新バージョンがダウロードできるページへと移る。図２のリンクをクリックする。

-図２最新バージョンダウンロードページ-

最新バージョンを選択するとどこのサーバからダウンロードするか選択できる。特に指定がなければ、図３に示すところでよいが、リリース情報が出た直後などは混雑するので、下のミラーサイトからダウンロードをオススメする。

-図３ダウンロード先-

ダウンロードしたファイルを解凍すると、図４のようにファイルが展開される。この段階で、eclipse.exeをクリックすればEclipseが起動がする。

-図４解凍完了-

しかし、図５のようにEclipseは英語表記だ。
コレを日本語化する手順を以降に解説する。

-図５ Eclipse初期起動-

再び、先ほどのページへと戻る。図６参照。
All versionsというリンクをクリックする。

-図６ All versions-

図７のようにLangage Packをクリックすると日本語化用のファイルがダウンロードされる。

-図７ Langage Pack-

ダウンロードできたら、解凍し、図８のように既に展開しているeclipseフォルダ配下にコピーする。

-図８上書きコピー-

これで起動すると、図９のように日本語化されて使えるようになる。

-図９日本語化成功-

みんなの地図2：Web・PSP、PlaceEngineと連携

[掲載記事]
・ITmedia +D Games：「PlaceEngine」でGPSがなくても位置を表示。Webとの連携でより便利に――「みんなの地図2」 (1/2)

・ソニーが地図サービス参入 - Web・PSP、そしてなんと、PlaceEngineと連携 (MYCOMジャーナル)

[ITmediaの記事引用]

「みんなの地図2」は2006年4月に発売された「みんなの地図」のバージョンアップ版。すでに発表されているとおり、2006年秋に発売されたPSP用GPSレシーバー「PSP-290」に対応するほか、ソニーコンピュータサイエンス研究所が開発した「PlaceEngine」を利用して、都市部ならばGPSがなくても位置が特定できる機能が搭載されている

（中略)

PetaMapは“ソーシャル・マッピング・サービス”と位置付けられており、ネット上の地図に口コミのスポット情報を作成＆共有できるWebサービスとなっている。登録料は無料だ。

ある意味最強のような気がする・・・。

StartForce：個人の為のブロードバンドデスクトップ

・StartForce

[CNET Japanの記事より引用]

StartForceは個人のためのブロードバンドデスクトップです。各個人が気に入っているウェブブラウザで稼働する、慣れ親しんだWindows風デスクトップ環境とダウンロードもインストールも必要ないリッチアプリケーションを提供しています。

[開発者のインタビュー記事 : CNET Japan]
・Web 2.0の挑戦者：ブラウザで使用可能なウェブデスクトップStartForce - CNET Japan

[StartForceのオフィシャルブログ]
・スタートフォースブログ

[実際に使ってみた]
早速、訪れてみての感想はOperaブラウザでは使えないこと。
ヘルプから動作推奨環境を見ると、InternetExplore 6.0以上、Mozilla FireFox 1.5以上に対応とのこと。
・動作環境は？｜スタートフォース～どこでも使えるブロードバンドデスクトップ

ということで、FireFoxブラウザを立ち上げ、新規登録を済ませ、ログインしてみた。

- デスクトップ -

Windows風をウリにしていることもあり、それっぽい。まずはデスクトップのアイコンをクリック。マイドキュメント（Windowsで言えば、エクスプローラにあたるファイル閲覧アプリ）を起動。

- マイドキュメント起動 -

新規フォルダ作成ボタンをクリックし、無駄にフォルダ作成してみた。レスポンスに違和感なく、マイドキュメント上にフォルダが作成された。
また、ウィンドウのタイトルバーを掴んで、デスクトップ上を移動させたり、最小化させてみた。若干ぎこちなさはあるものの、違和感なく動く。Ajax恐るべし・・・。

さすがに、本家Windowsに比べれば圧倒的に使用できるアプリケーションの数は少ない。テキストエディタ、画像ビューワ、ゲーム、計算機などが入っているが、中でも気になったのがオーディオプレーヤ。ブラウザ上で使うオーディオアプリ！？

その前に、再生用mp3ファイルをアップロード。ちなみに、このブラウザ上のデスクトップは、
・ディスク容量：200MB
・転送容量：4096MB
という仕様になっている。

- ファイルアップロード中 -

アップロードが完了したので、早速オーディオプレーヤを再生してみることにする。ところが、このFlashで作成されていると思しきオーディオプレーヤ、イマイチ使い方が不明。アプリ上のボタンにマウスカーソルを持っていっても、ヘルプは表示されないし、どこからファイルを読み込ませるのだ？？
と、使い勝手の悪さを気にしつつも、マイドキュメントから再生させることにした。

マイドキュメントより、右クリック - [Play in AudioPlayer]を選択。

- オーディオプレーヤ起動 -

おぉぉぉ！！
Windowsのデスクトップと同じように音楽が再生された。Web上にある音楽ファイルをブラウザで再生という驚愕の事実。（使い勝手は悪いけど。っていうか、YouTubeとかを考えれば、さほどすごい技術でもないか・・）

この音楽を聴きながら、
他にもいろいろ試してみた。
システムコンソールというたいそうな名前のついたアプリ。

- システムコンソール起動 -

これはWindowsコマンドプロンプトを真似たようなものだろう。helpと打てばさらに詳しい情報が表示されるとのこと。
・アプリケーションを実行
・コンソールをクリア
・ディレクトリの作成
　など・・

要するにこれはおもちゃだ。

次にスタートフォースメッセンジャーを起動。
これは、スタートフォースのメッセンジャーだけでなく、MSNやYahooのメッセンジャーにもログインできる。
このアプリを使えば、外出先でわざわざ、メッセンジャーをダウンロードしなくて良いから便利だろう。MSNで試してみたが、アプリ自体はスタートフォース独自のものなので、機能にかなり制限がある。

- メッセンジャー起動画面 -

この後も、アイコンをドラッグ＆ドロップさせたり、テキストエディタなどを使ってみたが、ブラウザ上で作業をしているということを忘れるくらい、Windowsっぽい動きをする。

使ってみて感じたことは、Web上のファイルサーバ的印象だ。今回行わなかった、ファイル共有などは、その典型だろう。画像ファイルなどをこのデスクトップにアップしておいて、知人宅や会社などで、閲覧したりダウンロードしたり。現時点ではこんな使い方が有効であるような気がする。

ただ、Webに興味がある人にとっては、
単に使ってて面白いとういのもあるけど。

desknet's with Ajax：Webベースのグループウェア

・Web2.0時代の新グループウェア desknet's with Ajax

Windowsライブラリを利用して実装しており、ドラッグ＆ドロップや子ウィンドウ表示など、デスクトップ・アプリに近い操作性を実現。

Snipshot:Webブラウザ経由で利用する画像ファイル編集ツール

・Snipshot: Edit pictures online
MochiKitライブラリを利用して構築されていて、動作が軽い。

[日本語の紹介サイト]
・オンラインで画像を編集できる「Snipshot」

[FireFoxで]
・右クリックメニューから画像を簡単編集できるFirefox拡張「Snipshot」

テーマ:インターネット - ジャンル:コンピュータ

MVCモデルについて

MVC(Model View Controllerの略)とはWebアプリ等のソフトウェア設計パターンの一つで、以下の３つの部分で構成される。

・Model：データの処理を行う
・View ：見た目
・Controller：Webアプリの制御（ViewとModelを制御）

Webアプリ作成に当たり、このモデルを使うと次のような利点がある。
・機能毎の分類が明確
・コンポーネント毎の独立性が確保される
・開発が分業しやすい
・他のコンポーネントの変更による影響を受けにくい

一般的な制御フローは以下の通り。
①ユーザがViewを操作する
②ControllerがViewからのイベントを処理する
③ControllerがModelにアクセス
④ViewがModelからデータを取得し、ページを更新
⑤①の操作があるまで待機

各コンポーネントの詳細は以下の通り
[Controller]
WebページとWebページ間の切替えなどの情報を集中管理。
遷移先のページに関する情報を個々のWebページから取り除き、全てこのControllerで管理する。個々のWebページは必ずControllerに飛ぶようにする。この事により、ページ遷移を変更したい場合は、Controllerの動作を変更するだけで良い。
一般的には、こうした遷移の情報は設定ファイルに書き込んでおく。
strutsのコントローラはアクションサーブレットというJavaサーブレットが担い、遷移先の情報はstruts-config.xmlの設定ファイルに記述する。
Ruby On Railsなどの最近のフレームワークは内臓されているコードジェネレータを利用し、機能毎に複数のControllerを生成する。

[View]
ユーザが直接目にするWebページを提供する。
複数のWebページの共通部分からなるテンプレートを予め用意しておき、そのページの中に表示するデータを入れ替えることで、Webページを生成する。わかりやすい例で言えば、ブログのテンプレートと記事の関係がこれに当たるだろう。
Webページを出力する際にテンプレートに実データをはめ込んで最終的なHTMLを完成させるのだが、テンプレートには、動的に生成したり、置換する箇所に目印をつけておく。後でその箇所を実際のデータで置き換える。
ブログのテンプレートがまさにその形になってる。

[Model]
ユーザがWebページで入力した値をはじめとする様々なデータを使って実際の処理を行う。SQLを発行してDBにアクセスするのが一般的だが、最近流行りのRuby On RailsなどはO/R(Object/Relation)マッピングが内臓されており、SQLを記述しなくても、O/Rマッピングツールが裏でSQLを発行してくれる。プログラマはDBを意識しないで、オブジェクト指向プログラミングを行えばよい。また、SQLをツールが発行する点は、SQLインジェクション対策にもなる。

prototype.js：ブラウザ互換を気にしないでシンプルなソースが書ける

・Prototype JavaScript framework: Easy Ajax and DOM manipulation for dynamic web applications

Ajaxのデファクトスタンダードライブラリ。
サーバとのXHR(XMLHttpRequest)で毎回使う、ブラウザの種類の判定や、通信処理進捗の判定を行ってくれる。

実際問題、「関西温泉マップ」作成にあたり、ブラウザの互換問題はプログラマ泣かだった・・・。IEとFireFoxで表示や処理に差異があり、何度もIEにブチ切れた。

また、このライブラリがデファクトスタンダードまでに普及したのは、「$」関数のおかげらしい。
この関数は、DHTMLで頻繁に使われる、document.getElementById('id')をたったこれだけで記述できる↓

$('id')

これによりタイプ量が減り、ソースの見栄えがかなりすっきりする。

テーマ:WEB系勉強中 - ジャンル:コンピュータ

livedoor Reader：国産の本格的JavaScript実装サイト

・livedoor Reader

[日経ソフトウェア 2006.10引用]

国産Ajaxアプリケーションの代表例といえるRSSリーダー。
世界でもトップレベルのJavaScriptが実装されている。

コレを期に導入してみようかな・・。

こんなのもあったから〆(._.)ﾒﾓﾒﾓ
・livedoor Reader 開発日誌 - livedoor Blog（ブログ）

[2007/03/13追記]
■導入してみた初日の感想
確かに前評判の通り、使いやすい。今までのRSSリーダは、Operaのリーダを使っていたのだが、サイトであるlivedor Readerの方がサクサク動いてるような気がする。そして、サイトとは思わせないようなインタフェース。引き続き感想は公開予定。

テーマ:お勧めサイト - ジャンル:コンピュータ

「WikiMapia」Google Mapsをブログに簡単貼り付け

任意の場所を指定して、建物名や地域に関するコメントを記述し、他のユーザと共有していくプロジェクト。
・Wikimapia - Let's describe the whole world!

それだけでなく、自分のブログにGoogle Mapsが貼り付けられるそうだ。その方法はネタフルさんの記事を参考にした。
・30秒でブログにGoogle Mapsを貼り付けられる「WikiMapia」

というわけで、関西上空の衛星写真の地図をブログに貼り付けてみました。
↓

Googleの奇妙な広告！？

先日、サイトを閲覧していると、Google Adsenseの奇妙な広告を発見した。
普段僕も、Google Adsense広告を配信している側なので、クリックすることはほとんど無いのだが、目を疑う内容だったのでクリックせざるを得なかった。

IE7 へアップグレードする広告・・・

リンク先はコチラ↓
・Google を快適に利用できる IE7 へアップグレードしよう

気づいている方もいると思うが、
なぜ、僕が奇妙だと思うかというと、Googleはマクロソフトのライバル的存在であり、まして、ブラウザに関して言えばFireFox用の広告すら作ってるくらいの会社なのに、ＩＥ７のアップグレードを勧めているから。

その証拠がこれ↓

広告として、競合するんじゃないの？

同じテレビ番組内で、アサヒビールとキリンビールのＣＭが流れるようなもの・・。

まー、Googleとしては、Googleツールバーを使ってもらうのにシェアNo.1のＩＥを勧めるのも妥当と言えば妥当なんだけど・・。要するにGoogleは、Googleツールバー使ってもらえるんなら、何でも有りってことか？

FireFoxに怒られるんじゃないの？
と、疑問に思う今日この頃。

テーマ:どーでもいいこと - ジャンル:コンピュータ

Eclipse、Ajaxやスクリプト言語向けのプロジェクトを発表

C-NET Japaの記事によれば、

・Eclipse、Ajaxやスクリプト言語向けのプロジェクトを発表

Eclipse FoundationはAjax関連のプロジェクトを３つ発表した。
そのプロジェクトは、

Ajaxアプリケーションの作成に用いられるJavaScriptや、そのほかのスクリプト言語向けのツールを充実させることを目的としたもの

以下にその３つ掲載する。
①Eclipse Rich Ajax Pratform
Ajaxアプリ開発において再利用可能なソフトウェアをあらかじめ用意することを目指すプロジェクト

②Eclipse Ajax Toolkit Framework
Eclipse Ajax Toolkit FrameworkがMac OS Xに対応。

③Eclipse Dynamic Languages Toolkit Project
Eclipseを用いた、Python、Ruby、Tclでの開発作業を用意にすることを目的としたプロジェクト。

テーマ:JavaScript - ジャンル:コンピュータ

Ajaxの２つの技術

AJAXウェブアプリケーションには大きく２つの技術を用いる。

①DHTML(Dynamic HTML)
ブラウザの描画などを行う。

②XHR(XMLHttpRequest)
ブラウザとサーバ間の通信を行う。

利用者はサーバからデータを取得する際、非同期にサーバと通信するので、レスポンスを待たなくもて良い。サーバから取得したデータはページを全体的に書き換えるのではなく、DHTMLで部分的に書き換える。その為、画面の切り替わりや再描画を待たなくて良い。