我正在寻找一个新的Javascript模板引擎来替换我的客户端模板需求的旧jQuery模板。基于DOM树的JavaScript模板引擎
我更喜欢模板引擎处理DOM树而不是文本字符串的方法，稍后将已煮熟字符串的内容转储到innerHTML。这是更好的性能明智的，我发现DOM操作更适当的方式来构建更多的DOM树。
我对Javascript模板引擎有什么选择，它会直接创建DOM树而不是基于文本的引擎？我喜欢Mustache.js的无逻辑方法，但它似乎只对字符串进行操作。原生jQuery集成也将是一个不错的功能。
透明度：
https://github.com/leonidas/transparency/
PURE：
http://beebole.com/pure/documentation/
板
https://github.com/flatiron/plates
为什么这一切：
我审查了所有4，他们都没有积极维护（我错了吗？）。 Pure有一个最近的承诺，但它很小。 Transparency.js在7个多月内没有看到提交（并且有大量未解决的问题）。 Plates和Weld似乎更不活跃。你有什么建议？ – Gili 2013-12-12 19:56:48
透明度维持AFAIK。现在它非常稳定，所以维护者pyykkis可能没有考虑添加新功能。这个人在IRC，并且据了解该项目并没有死亡。 – 2013-12-12 21:25:11
你在找什么样的糖？原始的DOM API总是为我工作得很好。如果您真的认同模板引擎在性能方面没有优势，那么如果您想有效地构建DOM树，请不要使用innerHTML。我倾向于使用document.createElement手动创建元素。我的模板是通过编写帮助程序函数创建的，这些函数可以创建节点集合，并通过设置.innerText属性将它们填充到数据中。然后，我可以缓存我希望经常参考的节点的引用，这样我就不必遍历DOM树来再次找到这些节点。
SOMA模板是一个新的。
纯DOM操作，很多功能，自然语法，可与其他库完全扩展，如underscore.string，带参数的函数调用，助手，监视器。根据需要只能更新一些节点的能力，DOM本身内部的模板。
哇，这个看起来不错。像AngularJS一样，但有一个更易于理解的API。 – 2012-12-10 22:05:53
我刚刚创建了纯和透明度启发DOM模板引擎。
它支持循环，条件和更多。
看看DOC：http://code.meta-platform.com/metajs/components/template/
不要affraid是MetaJS大库，模板lib可以独立使用。
短的例子：
HTML：
<div id="tpl">
<ul id="tasks">
<li>
<span class="task"></span>
<span class="due-date"></span>
</li>
</ul>
</div>
定义模板：
var tpl = Meta.Template(document.getElementById('tpl'), {
"ul#tasks li": $__repeat("tasks", {
".task": "task",
".due-date": $__date("d. m. Y", "due_date"),
"@": $__attrIf("completed", "complete")
})
});
渲染模板：
tpl({
tasks: [
{
task: "Write concept",
due_date: new Date(2015, 3, 22, 0, 0, 0, 0),
complete: true
}, {
task: "Consult with customer",
due_date: new Date(2015, 3, 25, 0, 0, 0, 0),
complete: false
}
]
});
结果：
<div id="tpl">
<ul id="tasks">
<li>
<span class="task" completed>Write concept</span>
<span class="due-date">22. 3. 2015</span>
</li>
<li>
<span class="task">Consult with customer</span>
<span class="due-date">25. 3. 2015</span>
</li>
</ul>
</div>
看看Monkberry DOM template engine。 
它非常小（只有1,5kB gzipped），无依赖库，服务器编译，单向数据绑定，并且速度非常快！
模板下面例子，生成的代码：
<div>
<h1>{{ title }}</h1>
<p>
{{ text }}
</p>
</div>
会生成：
var div = document.createElement('div');
var h1 = document.createElement('h1');
var p = document.createElement('p');
div.appendChild(h1);
div.appendChild(p);
...
view.update = function (data) {
h1.textContent = data.title;
p.textContent = data.text;
};
Monkberry支持if，for和自定义标签。并有很多渲染优化。 模板可以使用webpack，browserify或cli在服务器上呈现。
dna.js是一个模板引擎，克隆DOM元素（dnajs.org）。
一本书示例模板：
<h1>Featured Books</h1>
<div id=book class=dna-template>
<div>Title: <span>{{title}}</span></div>
<div>Author: <span>{{author}}</span></div>
</div>
呼叫插入模板的副本到DOM：
dna.clone('book', { title: 'The DOM', author: 'Jan' });
生成的HTML：
<h1>Featured Books</h1>
<div class=book>
<div>Title: <span>The DOM</span></div>
<div>Author: <span>Jan</span></div>
</div>
样品到 - 做应用你可以拨弄：
http://jsfiddle.net/wo6og0z8
dna.js的创建正是为了避免构建和传递字符串模板（我是project维护者）。
谢谢。我正在寻找一个潜在的解决方案，不尊重=） – 2012-02-14 18:43:05
http://blog.nodejitsu.com/micro-templates-are-dead – 2012-02-19 13:20:16
@qwertymk：习惯它，因为这是每个人将如何在浏览器中做模板在三年内。 – 2012-08-16 17:54:25