日記
データとテンプレートの配置 (15:16)Edit

ちょっと暇(というか仕事がぐだぐだになってきたんで、いったん調整のためにサスペンド)ができたんで、Ajax関連のことを考える時間に使ってみることにした。

Ajaxの具体的な使い方は、もちろん各機能要素のスペックが許す範囲でいろいろあり得るわけだけど、基本的な方針としてどういう使い方をメインにするべきだろう。

Ajaxのできることというと、結局のところ、

  • サーバーからデータを取得し、
    • JavaScriptのロジックで使用する(XML、JASON、その他)
    • 画面要素(HTML、DOM、その他)として使用する

になるんだろうけど、その後者のパターンにおいては、どういうやり方が一番いいんだろう。具体的にはテンプレートをどこに置くのが一番スマートなんだろう。

俺は基本的にサーバーサイドメインで考えるから、画面要素を取得する場合には、HTMLレベルまでサーバーサイドで展開してしまう方が好みだ。JavaScriptのテンプレートライブラリとかも使ってみたけど、いまいちしっくりこなかった。

ただ、Ajax(というか今後のJavaScriptを多用したアプリケーション)のメリットの一つである、UIに関するクライアントサイドでの自由度を低めてしまうのは、もしかしたらあまりよろしくないのかなーとも思ってしまう。

自分1人の問題ならば、どうせ何かあったらサーバーサイドいじっちゃうからいいんだけど、一般ユーザーがクライアントサイドでカスタムできる可能性ってのは、Ajax(もしくはJavaScriptベースのアプリ)の世界においてはそう簡単に捨ててはいけない要素のような気がする。

でもやっぱりJavaScript側でテンプレートを持つのはいやだなー。

と書いているうちに、何となく次のような設計にすればいいんじゃないかと思いついた。

  • 基本的にはサーバーサイドにテンプレートを持つ。サーバーサイドで処理をする場合はそれを使ってテンプレート展開する。
  • JavaScriptサイドでは、以下の3つのメソッドを用意する。
    • サーバーからデータを取得するメソッド
    • サーバーからテンプレートを取得するメソッド(このテンプレートは、サーバーサイドで持っているテンプレートデータから生成する)
    • テンプレートにデータを適用するメソッド

結局JavaScript側にテンプレートライブラリを持つわけだけど、JavaScriptで独立したものにはせず、データはサーバーと共用できるようにしておく。そうやっておくことで、同じHTMLをサーバーサイドで生成する場合もクライアントサイドで生成する場合も、テンプレートデータ自体は同じものを利用できる。クライアント側でテンプレート取得回りのロジックをいじればUI変更とかもできる。もちろんデータ取得メソッドは独立して利用できる。

すでにそういう方針で作られた(できればPHPの)ライブラリとかフレームワークはないかなー。

俺的に一番まっとうなアプローチは

SmartyのJavaScript用コンパイラ(データと同じスコープでevalすると、そのデータを使ってHTML展開された結果を返すようなJavaScriptコードを生成する)を書くことなんだろうなー。テンプレートデータの構文解析自体はPHP用のものをそのまま使えるだろうから、あとは各構文ごとの展開処理をJavaScript用に差し替えていけばいいのか。完全互換は難しいだろうけど、主要な構文だけだったら何とかなるかなー。さわりだけ試してみて、本格的に手を出す価値があるかどうかを検討しよう。

evalのスコープは

PHPとは違ってJavaScriptは未宣言の変数がグローバルスコープになっちゃうから、PHP互換でコンパイルした後に利用変数を頭に戻ってローカルスコープで宣言し直す必要がありそう? JavaScriptのevalってどういうスコープで実行されるんだろう? evalが実行される場所のスコープになるんだよね、きっと。

Published At2005-11-28 00:00Updated At2005-11-28 00:00