Web開発者は要注目!! JSONでAjaxアプリ開発 - Protoscript登場

Yahoo! Ajax Evangelist, Bill Scott氏は6日(米国時間)、Ajaxアプリケーションを開発するための新しいプロトタイプスクリプティング「Protoscript」を発表した。Protoscriptは既存のWebページに対して動作を追加することを目的としたスクリプト。かなりわかりやすい表記で動作を追加できるという特徴がある。

Protoscriptはいちからすべて開発されているのではなく、既存のプロダクトを組み合わせて機能が実現されている。まず、HTMLの要素を特定するためにjQueryが活用されているほか、動作やイベントへの対応にThe Yahoo User Interface LibraryやMooToolsが活用されている。

Webアプリケーションを開発するにあたって、UIを設計してから、そのUIに対して動作を付け足していく方法がある。直感的でわかりやすい方法だが、端的に言ってしまうとこの方法をサポートするスクリプトが「Protoscript」だ。Protoscriptがどのような方法でAjax Webアプリケーションの構築を実現しているかは実際のサンプルコードを見るのがてっとりばやい。Protoscriptのサイトでサンプルが公開されているのでここでひとつ紹介する。

Protoscriptのサンプル - 画像をクリックするとフェードアウトして消えるデモ

$proto('#avatar', {
  Click: {
    onClick: {
      Fade: {
        opacity: {to: 0},
        onComplete: {Close : {} }
      }
    }
  }
});

上記コードには「要素」「振る舞い」「イベント」がすべてまとまっている。これが一つの単位であり、Protoscriptの本質だ。Protoscriptではこうした記述を振る舞わせたい要素に対して順次作成しては追加していくというスタイルをとっている。

まず「'#avatar'」の部分で、id属性に"avatar"が指定されている要素が対象となる。サンプルのHTMLでは「<img id="avatar" src="images/billavatar.jpg">」とされているから、画像が動作を追加する対象となるわけだ。次に「Click:」と「onClick: 」でイベントが指定されている。クリックされた時に、というイベントを指定しているわけだ。イベントが発生したら「Fade:」と振る舞え、と指定している。さらにフェードアウトが完了後にクローズするように「onComplete:」したら「Close:」と記述されているわけだ。

文章では説明が難しいが、外側から内側にむかって要素を特定して、イベントを指定して、その振る舞いを指定する、という構造ができあがっていることがわかるだろう。しかもそのフォーマットはJSONそのものだ。JavaScriptの開発経験がなくてもデータ構造であるJSONは理解しやすい。要するに「要素」「イベント」「振る舞い」というパーツをJSONデータとして組み上げることでAjaxアプリケーションが開発できる、これが「Protoscript」というわけだ。

フレームワークの発想として同じアイディアを採用しているものは他にもあるが、ProtoscriptはプログラミングのスタイルとしてJavaScriptを多用するのではなく、基本的にJSONが記述できれば動作するように作られているところが注目に値する。JavaScriptでの開発となるとそれだけで開発できるデベロッパに限りがでてしまうが、ProtoscriptのようにJSONデータを作成するだけで済むとなれば、JavaScriptに精通していないほかのデベロッパや、場合によってはユーザレベルでもAjaxアプリケーションが開発できるようになるわけだ。

発表された段階では31の振る舞いと41を越えるデモが提供されている。フレームワークのアーキテクチャが明白であるうえ、記述スタイルがJSONに限定されており、さらに多くのサンプルが提供されている。Protoscriptを使ってAjax Webアプリケーションを開発することはかなり容易だ。興味があるデベロッパはダウンロードして試してみてほしい。プロダクト自身はGoogle Codeでホスティングされており、The BSD Licenseのもとで提供されている。YUIと同様、ライセンス的にも採用しやすい。

Protoscriptでは次のステップとしてドキュメントの充実、さらなる振る舞いの追加、FirebugをベースとしたGUIツールの提供、GUIツールを使って振る舞いを開発する機能の実現などが予定されている。今後の開発もかなり目が離せない状況だ。