Fork me on GitHub doT.js

The fastest + concise javascript template engine
for Node.js and browsers.

Origins

doT.js was created in search of the fastest and concise JavaScript templating function with emphasis on performance under V8 and Node.js. It shows great performance for both Node.js and browsers.

During my quest I found 2 template engines that caught my attention and inspired doT.
The first one was jQote2, a jQuery plugin, it was the first engine to break the speeds by using string concatenation and avoiding 'with' statements.
The second one was underscore.js which had a nicely designed extension friendly templating function.

doT.js is fast, small and has no dependencies.

Source

github.com/olado/doT

by Laura Doktorova, MIT license

Features

Usage play with it, edit and see results as you type

Template

Compile-time defines (def)

doT.template compiles it into

Data

Result

Compile time evaluation vs Runtime evaluation

You can improve performance further if you use compile time evaluation. It is useful in cases when the data that you want to use are not changing with each run of the template. Think of it as defines or constant variables.

It is also used to statically compile partials. This comes in handy when you want to include similar header and footer on multiple pages. doT also allows to customize partial right from the template that will include it.

Check advanced sample and one more sample for hints on how to use defines and partials.

Benchmarks

Here is the first benchmark of doT in jsperf.
Here is a more recent benchmark against the new and upgraded engines that popped up lately.
People are constantly adding new javascript template engine benchmarks.

Additional benchmarks are available in github

To run the benchmarks for measuring execution of compiled templates:
In the browser: navigate to benchmarks/index.html or go here
With node: node benchmarks/templatesBench.js

To run the benchmarks for measuring compilation speed:
In the browser: navigate to benchmarks/genspeed.html
With node: node benchmarks/compileBench.js

Installation

For Node.js

If you plan to use doT with Node.js, you can install doT with npm:

> npm install dot

Then use require('dot') in your code.

For browsers

Include the javascript file in your source:

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

Sample

// 1. Compile template function
var tempFn = doT.template("<h1>Here is a sample template {{=it.foo}}</h1>");
// 2. Use template function as many times as you like
var resultText = tempFn({foo: 'with doT'});

API

doT.templateSettings - default compilation settings

You can customize doT by changing compilation settings. Here are the default settings:
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
};
If you want to use your own delimiters, you can modify RegEx in doT.templateSettings to your liking.

Here is the list of default delimiters:

{{ }}for evaluation
{{= }}for interpolation
{{! }}for interpolation with encoding
{{# }}for compile-time evaluation/includes and partials
{{## #}}for compile-time defines
{{? }}for conditionals
{{~ }}for array iteration

By default, the data in the template must be referenced with 'it'. To change the default variable name, modify setting 'varname'. For example, if you set 'varname' to "foo, bar" you will be able to pass 2 data instances and refer to them from the template by foo and bar.

To control whitespace use 'strip' option, true - to strip, false - to preserve.

'append' is a performance optimization setting. It allows to tweak performance, depending on the javascript engine used and size of the template, it may produce better results with append set to false.

If 'selfcontained' is true, doT will produce functions that have no dependencies on doT. In general, generated functions have no dependencies on doT, with the exception for encodeHTML and it is only added if encoding is used. If 'selfcontained' is true and template needs encoding, encodeHTML function will be included in the generated template function.

doT.template - template compilation function

Call this function to compile your template into a function.

function(tmpl, c, def) By default, the produced function expects one parameter - data - with the name 'it'. The names and number of parameters can be changed by changing doT.templateSettings.varname

Node module supports auto-compilation of dot templates

You can precompile all your templates into modules compatible with commonJS, browsers and AMD.

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

This will compile .def, .dot, .jst files found under the specified path. Details

Basic usage:

	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"});

The above snippet will:

See code example, note there is an index.js file in output directory. It allows you to do things like:
	var render = require('./views');
	render.templateOne(data);
	render.templateTwo(data);

There is a CLI tool that does the same compilation

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

Example for express

Many people are using doT with express.
I added an example of the best way to do it: doT with express

Issues

github.com/olado/doT/issues

History

First released on January 10, 2011
Latest version: 1.0.3 December 2, 2014

Author

@olado
doT.js by Laura Doktorova, MIT license