[解決済み] javascriptでhtmlを生成するためのベストプラクティスはありますか？

質問

私はJSONでオブジェクトの配列を返すWebサービスを呼び出しています。 私はそれらのオブジェクトを取り、HTMLでdivに入力したい。 各オブジェクトがURLと名前を含んでいるとします。

各オブジェクトに対して次のようなHTMLを生成したい場合。

<div><img src="the url" />the name</div>

これに対するベストプラクティスはあるのでしょうか？いくつかやり方があるようですが。

1. 文字列を連結する
2. 要素の作成
3. テンプレートプラグインを使用する
4. サーバー上でhtmlを生成し、JSONで提供する。

どのように解決するのですか？

選択肢 #1 と #2 は最も直接的な選択肢になりますが、どちらの選択肢でも、文字列を構築するか DOM オブジェクトを作成することで、パフォーマンスとメンテナンスの影響を感じることになります。

テンプレートはそれほど未熟ではなく、主要なJavascriptフレームワークのほとんどで見られるようになりました。

ここにある例は JQuery テンプレートプラグイン を使用した例で、パフォーマンスの低下を防ぐことができます。

var t = $.template('<div><img src="${url}" />${name}</div>');

$(selector).append( t , {
     url: jsonObj.url,
     name: jsonObj.name
});

私はクールなルート（そしてより良いパフォーマンス、よりメンテナンスしやすい）で、テンプレート化を使うことを提案します。