JavaScript template language shootoff

JavaScript performance comparison

Revision 722 of this test case created by

Preparation code

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://gist.github.com/raw/550881/29bb186167079c0b33ab6e9d50d779f37860cfa4/micro.js"></script>
<script src="http://gist.github.com/raw/860240/cd98cacbdeee7eb2cfb2ca3ca76638dae2a5b1af/micro3.js"></script>
<script src="https://github.com/olado/doT/raw/master/doU.js"></script>
<script src="http://ectjs.com/js/coffee-script.js"></script>
<script src="http://ectjs.com/js/ect.min.js"></script>
<script src="http://jsmart.googlecode.com/files/smart-2.9.min.js"></script>

  window.micro = "<div><ul class='list'><% for (var i = 0, l = list.length; i < l; i++) { %><li class='item'><%= list[i] %></li><% } %></ul></div>";
  
  window.micro2 = "<div><ul class='list'><% for (var i = 0, l = data.list.length; i < l; i++) { %><li class='item'><%= data.list[i] %></li><% } %></ul></div>";

  window.smartTemplate = "<div><ul class='list'>{foreach $list as $i}<li class='item'>{$i}</li>{/foreach}</ul></div>";

  window.doUtemplate = doU.template("<div><ul class='list'>{{ for (var i = 0, l = it.list.length; i < l; i++) { }}<li class='item'>{{= it.list[i] }}</li>{{ } }}</ul></div>");

  window.ectTemplate = "<div><ul><% for i in @list : %><li class='item'><%- i %></li><% end %></ul></div>";

  window.resigTemplate = tmpl(micro);
    
  window.resigTemplate3 = tmpl3(micro2);

  var root = {};
  window.ect = ECT({ cache : false, root : {
    'template': window.ectTemplate
  }});

  window.smart = new jSmart(window.smartTemplate);

  var list = [];
  for (var i = 0; i < 2000; i++) {
    list.push(i);
  }

  window.sharedVariables = {
   list: list
  };
</script>
    

Preparation code output

<script src="http://gist.github.com/raw/550881/29bb186167079c0b33ab6e9d50d779f37860cfa4/micro.js"></script> <script src="http://gist.github.com/raw/860240/cd98cacbdeee7eb2cfb2ca3ca76638dae2a5b1af/micro3.js"></script> <script src="https://github.com/olado/doT/raw/master/doU.js"></script> <script src="http://ectjs.com/js/coffee-script.js"></script> <script src="http://ectjs.com/js/ect.min.js"></script> <script src="http://jsmart.googlecode.com/files/smart-2.9.min.js"></script> window.micro = "<div><ul class='list'><% for (var i = 0, l = list.length; i < l; i++) { %><li class='item'><%= list[i] %></li><% } %></ul></div>"; window.micro2 = "<div><ul class='list'><% for (var i = 0, l = data.list.length; i < l; i++) { %><li class='item'><%= data.list[i] %></li><% } %></ul></div>"; window.smartTemplate = "<div><ul class='list'>{foreach $list as $i}<li class='item'>{$i}</li>{/foreach}</ul></div>"; window.doUtemplate = doU.template("<div><ul class='list'>{{ for (var i = 0, l = it.list.length; i < l; i++) { }}<li class='item'>{{= it.list[i] }}</li>{{ } }}</ul></div>"); window.ectTemplate = "<div><ul><% for i in @list : %><li class='item'><%- i %></li><% end %></ul></div>"; window.resigTemplate = tmpl(micro); window.resigTemplate3 = tmpl3(micro2); var root = {}; window.ect = ECT({ cache : false, root : { 'template': window.ectTemplate }}); window.smart = new jSmart(window.smartTemplate); var list = []; for (var i = 0; i < 2000; i++) { list.push(i); } window.sharedVariables = { list: list }; </script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
Resig Micro-Templating.
resigTemplate(sharedVariables);
pending…
doU.js
doUtemplate(sharedVariables);
pending…
Resig Micro-Templating with += instead of push and join
resigTemplate3(sharedVariables);
pending…
ECT
ect.render('template', sharedVariables);
pending…
jSmart (Smarty)
window.smart.fetch(sharedVariables);
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL.

0 Comments

window.micro = "
"; window.micro2 = "
"; window.smartTemplate = "
"; window.doUtemplate = doU.template("
"); window.ectTemplate = "
"; window.resigTemplate = tmpl(micro); window.resigTemplate3 = tmpl3(micro2); var root = {}; window.ect = ECT({ cache : false, root : { 'template': window.ectTemplate }}); window.smart = new jSmart(window.smartTemplate); var list = []; for (var i = 0; i < 2000; i++) { list.push(i); } window.sharedVariables = { list: list };