精巧快速的 JavaScript 模板引擎
Node.js 和浏览器同样适用。

起源

doT.js 灵感来源于搜寻基于 V8 和 Node.js ，强调性能，最快速最简洁的 JavaScript 模板函数。 它在 Node.js 和浏览器两端都彰显出卓越的性能。

在我搜寻期间，两款模板引擎引起了我的注意，激发了创造 doT 的灵感。

第一个是 jQote2，一个 jQuery 插件，它使用字符串拼接，避免使用 'with' 声明，它是首个追求速度的引擎。
第二个是 underscore.js ，其中有一个设计精巧、扩展友好的模板函数。

doT.js 快速，小巧且毫无依赖。

来源

作者 Laura Doktorova, 基于 MIT 协议

特性

• 无依赖, 120 行代码
• 极其快速
• 自定义定界符 (custom delimiters)
• 运行时求值 (runtime evaluation)
• 运行时插值 (runtime interpolation)
• 编译时求值 (compile-time evaluation)
• 支持局部模板
• 支持条件语句
• 数组迭代器
• 编码
• 控制空白字符 - 全去或保留
• 流式友好 (streaming friendly)
• 轻逻辑或者重逻辑，由你决定

使用 亲手试试，编辑输入然后看编译结果

编译时求值 vs 运行时求值

同样适用于静态编译局部模板。多个页面引入相似的 header 和 footer 时非常方便。 doT 也可以自定义局部模板。

基准测试

doT 在 jsperf 上面的首次测试
这是一些针对最新升级引擎的 测试结果。
人们会不断添加新的 javascript 模板引擎测试。

安装

用于 Node.js

如果你打算在 Node.js 中使用 doT，可以通过 npm 安装 doT ：

> npm install dot

用于浏览器

<script type="text/javascript" src="doT.js"></script>

示例

API

doT.templateSettings - 默认编译设置

doT.templateSettings = {
  evaluate:    /\{\{([\s\S]+?)\}\}/g,
  interpolate: /\{\{=([\s\S]+?)\}\}/g,
  encode:      /\{\{!([\s\S]+?)\}\}/g,
  use:         /\{\{#([\s\S]+?)\}\}/g,
  define:      /\{\{##\s*([\w\.$]+)\s*(\:|=)([\s\S]+?)#\}\}/g,
  conditional: /\{\{\?(\?)?\s*([\s\S]*?)\s*\}\}/g,
  iterate:     /\{\{~\s*(?:\}\}|([\s\S]+?)\s*\:\s*([\w$]+)\s*(?:\:\s*([\w$]+))?\s*\}\})/g,
  varname: 'it',
  strip: true,
  append: true,
  selfcontained: false
};

这是默认的定界符列表：

默认情况，模板中的数据必须用 'it' 作为引用。修改设置中的 'varname'，可以改变默认的变量名。 例如，你可以把 'varname' 设置成 "foo, bar"，就可以传2个数据实例，通过 foo 和 bar 与模板建立关联。

使用 'strip' 选项控制空白字符，true - 全部去掉，false - 保留。

'append' 是性能优化设置。通过它调整性能，根据使用的 javascript 引擎和模板的大小，append 设置成 false，可能会产生更好的效果。

如果 'selfcontained' 为 true，doT 将毫无依赖的产生函数。通常，doT 都是无依赖的，除非用到编码时，encodeHTML 会被加入。 如果 'selfcontained' 为 true，模板需要编码，encodeHTML 方法将被引入生成模板的函数中。

doT.template - 模板编译函数

调用此函数把你的模板编译成一个方法。

• tmpl - 模板正文
• c - 自定义编译设置，如果为 null，用到 doT.templateSettings
• def - 编译时求值的数据， 这里是 进阶示例.

Node 模块支持 dot 模板的自动编译

你可以预编译所有模板生成兼容 commonJS，浏览器和 AMD 的模块。

var dots = require("dot").process({ path: "./views"});

将编译指定路径下的 .def， .dot， .jst 文件。 详情

• 模板文件同时可以有多个扩展名。
• .def扩展名文件可以通过 {{#def.name}} 引入其它文件
• .dot扩展名文件可以编译成同名函数，通过 render.<filename> 访问。
• .jst扩展名文件编译成 .js 文件。产生的 .js 文件可以作为 commonJS，AMD 模块加载，或者安装到全局变量（默认设置成 window.render）
• 所有定义在.jst文件中的行内定义，被编译成单独的函数，通过 render.<filename>.<definename> 可取到。
• 忽略子目录。

基本用法：

	var dots = require("dot").process({path: "./views"});
	// using .jst files
	var render = require('./views/mytemplate');
	render({foo:"hello world"});
	// using .dot files
	dots.mydottemplate({it: "dot"});

以上代码片段将：

• 编译 views 文件夹中的所有模板(.dot, .def, .jst)
• 从 .jst 模板编译成的 .js 文件，放到同名的文件夹。这些文件可以被 require 引用，比如 require("./views/mytemplate")
• 返回一个对象，从 .dot 模板编译成的函数作为它的属性
• 渲染 mytemplate 模板
• 注意：编译后的文件同样适用于浏览器

	var render = require('./views');
	render.templateOne(data);
	render.templateTwo(data);

有个 CLI 工具可以做同样的编译

./bin/dot-packer -s examples/views -d out/views

express 示例

问题

历史

作者