米Adobe Systems(以下、Adobe)は、同社の技術者向けサイト「Adobe Labs」で、5月11日、Ajax向けのフレームワーク「Spry framework for Ajax」を発表した。"JavaScript library for web designers(WebデザイナーのためのJavaScriptライブラリ)"と銘打たれたこのフレームワークを利用すれば、高品質な演出をWebデザイナーが手軽に施すことができる。

ここでは、技術的な観点を交えてSpry frameworkの魅力を紹介してみよう。

フレームワークの種類

フレームワークとは、プログラミングを行う時に土台となるプログラムのこと。Ajaxの場合は特にブラウザ間の依存性解消などの理由で、フレームワークが非常に重宝されている。
数あるAjaxフレームワークの中で、現在最も多く採用されているのが prototype.js。これを元にしたプロダクトも多数存在する。

その他、現在では Yahoo!や Googleも、ライブラリやツールキットと呼ばれる製品をリリースしており、大小合わせると 50以上が存在する。

• Yahoo! UI Library
• Google Web Tool Kit

このような状況下で、Adobeが開発したフレームワークは、いったいどのような存在となっていくのだろうか。公開されているデモプログラムから探ってみたい。

Spry frameworkの機能

Adobe Labsには、現在3種類のデモプログラムが公開されている。

• Photo Gallary - 画像の拡大縮小技術を使った、電子アルバム
• Product Table - XMLファイルの読み込み技術を使った、製品一覧
• RSS Reader - RSSファイルの読み込み技術を使った、RSSリーダ

例えば、「Product Table」のページ上部にある「View Source」というリンクをクリックすると、プログラムソースを見ることができる。

その中で、プログラムらしい記述は、下記の2行程度。

たったこれだけの記述で、「製品の一覧表と、一覧をクリックすると製品詳細を右側のウィンドウに表示される」という処理を実現している。

ポイントは、各HTMLタグに書かれた拡張属性だ。

ここでは、tbodyタグに「spryrepeatchildren」という独自の属性を付加し、dsProductsと接続している。dsProductsは、前述のプログラムソースの1行目に書かれているオブジェクトであり、同じディレクトリ内にある「products.xml」というファイルを参照している。これにより、Spry frameworkを通じて、product.xmlファイル内の製品情報を、自動的にHTMLのテーブルに仕立て上げてくれるわけだ。

このようにSpry frameworkは、HTMLタグの属性にさまざまな情報を書き込むだけで、高機能なAjaxプログラムを作れるようになっているのである。

Spry frameworkの可能性

Spry frameworkをAdobeがリリースした意味は大きい。

なぜなら、Adobeは GoLiveと、そして買収したMacromediaのDreamweaverという二大Webオーサリングツールを有する、Web制作のリーディングカンパニーであるからだ。
「Webデザイナーのために」と肩書きをつけたこの製品を、Adobeはこのままの形でリリースするとは考えにくい。

私が考えるに、おそらく彼らはこれをDreamweaverやGoLiveの一機能として開発しているのではないかと考えている。機能ボタンをクリックするだけで、Ajaxを利用したWebページがあっという間に出来上がるのだ。

かつて、「ロールオーバーボタン」はJavaScriptのプログラムを開発する必要があった。しかし、今やDreamweaverで誰しも当然のように扱うことができている。Adobeの手によって、Ajaxもそんな存在になる日が来るのかもしれない。