This project provides a framework for running benchmarks against multiple templating engines under Node.js. The following templating engine modules are currently integrated:
| Template | Syntax | Streaming | Asynchronous | Auto-escape |
|---|---|---|---|---|
| dustjs-linkedin | Text | ✔ | ✔ | ✔ |
| doT | Text | ✖ | ✖ | ✖ |
| handlebars | Text | ✖ | ✖ | ✔ |
| pug | Short-hand HTML | ✖ | ✖ | ✔ |
| marko | HTML/Concise HTML | ✔ | ✔ | ✔ |
| nunjucks | Text | ✖ | ✔ | ✖ |
| react1 | JSX | ✖ | ✖ | ✔ |
| swig | Text | ✖ | ✖ | ✔ |
NOTE 1: While React is not a "templating engine", it is commonly used to render HTML on the server so it has been included in this benchmark.
- Clone this repository
npm installnpm test(ormake)
The following results were collected with the following setup:
- Node.js v6.0.0
- MacBook Pro (Retina, 15-inch, Mid 2014)
- Processor: 2.8 GHz Intel Core i7
- Memory: 16 GB 1600 MHz DDR3
Higher numbers are better.
RUNTIME PERFORMANCE
===================
friends
✓ marko » 4,796 op/s (fastest)
✗ dust » 1,034 op/s (78.44% slower)
if-expression
✓ marko » 415,358 op/s (fastest)
✗ pug » 281,887 op/s (32.13% slower)
projects-escaped
✓ marko (native-for) » 100,015 op/s (fastest)
✗ marko » 99,583 op/s (0.43% slower)
✗ handlebars » 58,383 op/s (41.63% slower)
✗ dust » 44,827 op/s (55.18% slower)
projects-unescaped
✓ marko (native-for) » 444,603 op/s (fastest)
✗ marko » 397,968 op/s (10.49% slower)
✗ handlebars » 159,114 op/s (64.21% slower)
✗ dust » 86,164 op/s (80.62% slower)
reverse-helper
✓ marko » 514,300 op/s (fastest)
✗ dust » 269,109 op/s (47.67% slower)
search-results
✓ marko » 39,775 op/s (fastest)
✗ dust » 10,543 op/s (73.49% slower)
simple-1
✓ marko » 234,384 op/s (fastest)
✗ pug » 229,040 op/s (2.28% slower)
✗ dot » 219,742 op/s (6.25% slower)
✗ handlebars » 109,665 op/s (53.21% slower)
✗ dust » 92,114 op/s (60.70% slower)
✗ swig » 82,274 op/s (64.90% slower)
✗ nunjucks » 35,635 op/s (84.80% slower)
✗ react » 4,801 op/s (97.95% slower)
simple-2
✓ marko » 368,667 op/s (fastest)
✗ dust » 106,878 op/s (71.01% slower)
ui-components
✓ marko » 85,915 op/s (fastest)
✗ react » 4,076 op/s (95.26% slower)
Lower numbers are better.
COMPILED SIZE (gzipped/uncompressed)
====================================
friends
✓ marko » 470 bytes gzipped 914 bytes uncompressed
(smallest) (smallest)
✗ dust » 489 bytes gzipped 1387 bytes uncompressed
3.89% larger 34.10% larger
if-expression
✓ marko » 281 bytes gzipped 469 bytes uncompressed
(smallest) (smallest)
✗ pug » 1196 bytes gzipped 2801 bytes uncompressed
76.51% larger 83.26% larger
projects-escaped
✓ marko » 247 bytes gzipped 379 bytes uncompressed
(smallest) (smallest)
✗ dust » 262 bytes gzipped 563 bytes uncompressed
5.73% larger 32.68% larger
✗ marko (native-for) » 271 bytes gzipped 407 bytes uncompressed
8.86% larger 6.88% larger
✗ handlebars » 553 bytes gzipped 1551 bytes uncompressed
55.33% larger 75.56% larger
projects-unescaped
✓ marko » 250 bytes gzipped 380 bytes uncompressed
(smallest) (smallest)
✗ dust » 268 bytes gzipped 595 bytes uncompressed
6.72% larger 36.13% larger
✗ marko (native-for) » 275 bytes gzipped 408 bytes uncompressed
9.09% larger 6.86% larger
✗ handlebars » 530 bytes gzipped 1573 bytes uncompressed
52.83% larger 75.84% larger
reverse-helper
✓ dust » 151 bytes gzipped 321 bytes uncompressed
(smallest) 31.78% larger
✗ marko » 167 bytes gzipped 219 bytes uncompressed
9.58% larger (smallest)
search-results
✓ marko » 536 bytes gzipped 1189 bytes uncompressed
(smallest) (smallest)
✗ dust » 545 bytes gzipped 1523 bytes uncompressed
1.65% larger 21.93% larger
simple-1
✓ marko » 251 bytes gzipped 369 bytes uncompressed
(smallest) (smallest)
✗ dust » 255 bytes gzipped 493 bytes uncompressed
1.57% larger 25.15% larger
✗ react » 262 bytes gzipped 478 bytes uncompressed
4.20% larger 22.80% larger
✗ dot » 362 bytes gzipped 559 bytes uncompressed
30.66% larger 33.99% larger
✗ handlebars » 434 bytes gzipped 880 bytes uncompressed
42.17% larger 58.07% larger
✗ nunjucks » 466 bytes gzipped 991 bytes uncompressed
46.14% larger 62.76% larger
✗ swig » 558 bytes gzipped 2636 bytes uncompressed
55.02% larger 86.00% larger
✗ pug » 788 bytes gzipped 1508 bytes uncompressed
68.15% larger 75.53% larger
simple-2
✓ marko » 255 bytes gzipped 484 bytes uncompressed
(smallest) (smallest)
✗ dust » 268 bytes gzipped 648 bytes uncompressed
4.85% larger 25.31% larger
ui-components
✓ marko » 179 bytes gzipped 219 bytes uncompressed
(smallest) (smallest)
✗ react » 204 bytes gzipped 310 bytes uncompressed
12.25% larger 29.35% larger
Below are the approximate runtime sizes for each engine (lower numbers are better):
| Modules | Size |
| ------------- |:-------------:| -----:|
| marko | ~1.2KB gzipped (2.7KB uncompressed) |
| marko +async-writer + raptor-xml/util | ~2.33KB gzipped (6.3KB uncompressed) |
NOTE: Sizes are approximate because overhead associated with the CommonJS module loader varies. Size based on code as of April 7, 2014.
| Modules | Size |
| ------------- |:-------------:| -----:|
| dust-core | 3.41KB gzipped (10.07KB uncompressed) |
| dust-core +dust-helpers | 4.7KB gzipped (14.2KB uncompressed) |
NOTE: Size based on code as of April 7, 2014.
Each comparison group should contain a data file (either data.json or data.js) and a set of templates to compare. The file extension of the template will be used to determine which engine should be used. If the data file has the .js extension then it should be a JavaScript module that exports the data. A sample directory structure is shown below:
templates
├── group1
│ ├── data.js
│ ├── template.dust
│ └── template.marko
├── group2
│ ├── data.json
│ ├── template.dust
│ └── template.marko
├── group3
│ ├── data.json
│ ├── template.dust
│ ├── template.native-for.marko
│ └── template.marko
└── group4
├── data.json
├── template.dust
└── template.marko
To register a new templating engine, simply create a new module under the engines directory and it will automatically be loaded. See existing engine modules for supported methods and properties.
Pull Requests welcome!