以前のエントリ、JSテンプレートエンジンhandlebars.jsを使ってみるのその２です。
handlebarsはプリコンパイルして使わないとパフォーマンスに難点があるので、ぜひとも使いたい所です。
今回はプリコンパイルできる環境をつくります。
事前の準備
npmでインストールするので、node.jsとnode.jsを入れる為にhomebrewをインストールします。
まずはhomebrewをインストールします。
$ ruby -e "$(curl -fsSL https://raw.github.com/mxcl/homebrew/go/install)"
node.jsをインストールします。
$ brew install node
handlebarsをインストール
$ sudo npm install -g handlebars /usr/local/bin/handlebars -> /usr/local/lib/node_modules/handlebars/bin/handlebars
実際に使ってみる
コマンドラインからプリコンパイルを実行します。
$ handlebars sample.hbs -e 'hbs' -m -f sample.js
実際にはコマンドラインからでなく、phpstormのFileWacher機能を利用してプリコンパイルを自動化してます。ただし、若干タイムラグがあるので、開発中は使い勝手に若干難があります。そこで、開発中など頻繁に更新する場合はオリジナルのテンプレートを使い、商用環境ではプリコンパイルしたテンプレートを使う様に対応します。
実際の構成としては3つのファイルとなります。
smarty_template.tpl (smartyテンプレート)
sample.hbs (handlebarsテンプレート)
precompaled.js (precompaileテンプレートjsファイル)
hbsファイルを使うか、プリコンパイルテンプレートを使うかを切り替えるsmartyFunctionです。
https://gist.github.com/akifumi-kamata/f3dbe6dc599d30fcdd57
smartyのテンプレートからは以下の様に呼び出します。
{handlebarsDisplay template=$HBS_NAME values='datas' output='#contentsData' usePreCompile=$usePreCompileTemplate}
次回？？
基本的にはロジックレス(渡された値を表示するだけ)として使っているので、ヘルパーも作らず使っているのですが、良いものあれば紹介していきたいです。
