For a long time i wished to have the ability to move my XHTML or CSS  code/formatting out of my javascript libraries.  I lately heard about  javascript templates engines. Either standalone or plugged into existing frameworks these tools are the next step for web developpers.

I will only speak about tree of them :


Basicaly I choosed them because they have the functionality to process hierachical JSON data input, mainly arrays and evolved syntax. I originally wrote this benchmark script for my own knowledge, since i found it interresting i decided to release it to the public.

The results shown by the benchmark tool are not intended to guide anyone in choosing the "best" template engine, be aware that speed is not the only and further less the most important criteria in the process of choosing the right template engine for your application. However, it can help if the speed and overall performance is an important issue at some point.

Note that since the benchmark itself runs on client side, results shown will only be true on your computer and are heavily dependents of its load at the time your are running the test. Oh, a trivial thing, this benchmark is not running at all with internet explorer.

The benchmark:
This script, will run the different template transformation methods from the librairies the same amount of time for each. It will time every call to these method and stock them into an array. This array will then be processed to display plots using a jQuery plugin named flot (http://code.google.com/p/flot/) and summary informations about each of the tree mentioned librairies. To let the control to the browser, the data (JSON) will be splitted into small chunks. You can configure how much data is processed and the chunk's size.

As a last note, I would be glad if you contact me if you notice any discrepancy in the benchmark results.

Javascript template engines benchmarking