jQueryではじめるAjax

第5回 jQuery UIによるユーザインターフェースの改良

この記事を読むのに必要な時間:およそ 15 分

まとめ

今回はjQuery UIの「Dialog」⁠Draggables」⁠Droppables」⁠Sortables」を使ってビデオプレーヤとお気に入り機能を実装してみました。 かなり使いやすくなったと思います。jQuery UIを使うと,操作性の高いUIを簡単に実装することができますね。

今回実装したお気に入り機能は,ブラウザを閉じると消えてしまいます。 もし,将来的にYoutube APIで,Youtubeのお気に入りに登録できるAPIが公開されたら,それと連携するのもいいかもしれません。

Ajaxの使いどころ

さて,今回で,⁠jQueryではじめるAjax」は終了です。最後にAjaxの使いどころをまとめて終わりたいと思います。

Ajax技術はこれまでのWebアプリケーションの実装をすべて置き換えるものではありません。 どのような時に適用するのが効果的でしょうか。

データのリクエストのために,ユーザの操作を妨げたくないとき

通常のWebアプリケーションでは,リクエスト毎にページの切り替えが発生するため,そこでユーザの操作が一時中断されてしまいます。

たとえば,第4回で実装したSuggest機能ですが,リクエストの度に画面が切り替わっては,検索キーワードの入力が非常に不便になります。

効果的に使えば,操作性の優れたアプリケーションになります。

「必要なとき」「必要なだけ」データを使いたいとき

アプリケーションによっては,いま,クライアントで保持しているデータに,ユーザの操作等によって生じた差分データがほしい場合があります。

たとえば,Google Mapでは,ユーザの地図のドラッグによって,地図データの差分が必要になります。 逆にいうと差分だけあればアプリケーションは動作することができます。

これまでは,画面を切り替えて,必要な全ての地図データを含めたHTMLを再描画しなければなりませんでしたが,Ajaxを使えばデータの通信量を小さく抑えることができ,操作性も向上させることができます。

そのほかにも,チャットアプリケーションや,株価を表示するようなアプリケーションのようなものが考えられます。

最後に

本連載では,初めてAjaxを実装する方へ,jQueryを使った基本的な実装方法を解説しました。 連載をご参考にして,よりよいWebアプリケーションを作ってください!それでは。

著者プロフィール

池田正一(いけだまさかず)

仕事ではもっぱらJavaを使い,たまにC/C++を書かされ,WebサービスをRubyで開発するプログラマ。ドラえもん好きでドラえもんSuperDatabaseの管理人。stacktrace.jpにて頭の中のStackを出力中。