Ajaxを使った開発において、Prototype.jsなどのAjaxではレスポンスを全て指定したID内に入れてしまうことでごく簡単に複雑なレンダリング結果を表示できるようにしている。Ajaxというと、結果のXMLを操作して複雑にJavaScriptを操作しなければならないというイメージに比べてずいぶん単純になり、身近になった。

ピクチャ 77.png

サンプル

 

だがそれでは通信量が増えてしまうのも事実だ。ごくシンプルなデータを複雑なレンダリングにつなげる、こちらを使ってみよう。

今回紹介するオープンソース・ソフトウェアはPURE、JavaScript向けのHTMLレンダリングエンジンだ。

PUREはjQueryプラグインとして動作するソフトウェアで、複雑なレンダリングを実現しようと思うとなかなか難しいJavaScriptによるHTMLレンダリングを容易にしてくれるソフトウェアだ。

ピクチャ 78.png

クリックするとデータを追加するサンプル

 

例えば、現在のテーブルデータを取得して、そこにデータを追加して表示を増やすと言ったことや、リストを追加する、指定したHTMLの内容をベースに内容を書き換えるといったこともできる。

これを使えばある一部分をテンプレートとして、その内容を修正して反映することも簡単にできそうだ。記法が独特なので、覚える必要がありそうだが一度覚えてしまえば強力なライブラリになり得る。

対応ブラウザはIE6.0以上、Firefox 2以上、Safari 2以上、Opera 9以上となっている。HTMLレンダリングが容易になれば、もっとJavaScriptを活用できるようになりそうだ。

 

PURE Unobtrusive Rendering Engine for HTML

 http://beebole.com/pure/

pure - Google Code

 http://code.google.com/p/pure/