JsTpl (v869)

Revision 869 of this benchmark created by hsiaosiyuan on

Description

test JsTpl version 0.0.2

Preparation HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script src="http://beebole.com/pure/wp-content/themes/BeeBole-pure/libs/pure.js"></script>

<script src="http://documentcloud.github.com/underscore/underscore.js"></script>

<script src="http://mustache.github.com/extras/mustache.js"></script>

<script src="http://hsiaosiyuan.com/jsTpl/jsTpl-0.2.js"></script>

<script src="https://github.com/QLeelulu/nTenjin/raw/master/nTenjin.js"></script>

<div class="purejs_template"><div><h1 class="header"></h1><div class='a'></div><div class='b'><div class='c'><div class='d'><div class='e'><div class='f'></div></div></div></div></div></div></div>

<script>
  window.mustacheTemplate = "<div><h1 class='header'>{{header}}</h1><div class='a'>{{a}}</div><div class='b'>{{b}}<div class='c'>{{c}}<div class='d'>{{d}}<div class='e'>{{e}}<div class='f'>{{f}}</div></div></div></div></div></div>";
  
  window.underscoreTemplate = _.template("<div><h1 class='header'>#{header}</h1><div class='a'>#{a}</div><div class='b'>#{b}<div class='c'>#{c}<div class='d'>#{d}<div class='e'>#{e}<div class='f'>#{f}</div></div></div></div></div></div>");
  
  window.sharedVariables = {
   header: "Header",
   a: 'aaa',
   b: 'bbb',
   c: 'ccc',
   d: 'ddd',
   e: 'eee',
   f: 'fff'
  };

  window.sharedVariables2 = {
   header: "Header",
   header2: "Header2",
   header3: "Header3",
   header4: "Header4",
   header5: "Header5",
   header6: "Header6",
   list: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10']
  };

window.tenjinTemplate = "<div><h1 class='header'>#{ header }</h1><h2 class='header2'>#{ header2 }</h2><h3 class='header3'>#{ header3 }</h3><h4 class='header4'>#{ header4 }</h4><h5 class='header5'>#{ header5 }</h5><h6 class='header6'>#{ header6 }</h6><ul class='list'><?js for (var i = 0, l = list.length; i < l; i++) { ?><li class='item'>#{ list[i] }</li><?js } ?></ul></div>";
  
  window.convertedTenjinTemplate = new Shotenjin.Template();
  window.convertedTenjinTemplate.convert(tenjinTemplate);
  
  window.nTenjinTemplate = "<div><h1 class='header'>#{ it.header }</h1><h2 class='header2'>#{ it.header2 }</h2><h3 class='header3'>#{ it.header3 }</h3><h4 class='header4'>#{ it.header4 }</h4><h5 class='header5'>#{ it.header5 }</h5><h6 class='header6'>#{ it.header6 }</h6><ul class='list'><?js for (var i = 0, l = it.list.length; i < l; i++) { ?><li class='item'>#{ it.list[i] }</li><?js } ?></ul></div>";
  
  window.convertednTenjinTemplate = new nTenjin.Template();
  window.convertednTenjinTemplate.convert(nTenjinTemplate);
</script>

Setup

var jsTpl_template = '<h1 class="{{this.header}}">{{this.header}}</h1><h2 class="{{this.header2}}">{{this.header2}}</h2><h3 class="{{this.header3}}">{{this.header3}}</h3><h4 class="{{this.header4}}">{{this.header4}}</h4><h5 class="{{this.header5}}">{{this.header5}}</h5><h6 class="{{this.header6}}">{{this.header6}}</h6><ul class="list">    {{var list = this.list,i=0,len=list.length;}}    {{for(;i<len;++i):}}        <li class="item">{{list[i]}}</li>    {{endfor;}}</ul>';
    
    var jsTpl = (new JsTpl(jsTpl_template )).getCTpl();

Test runner

Ready to run.

Testing in
TestOps/sec
Mustache.js Template
Mustache.to_html(mustacheTemplate, sharedVariables);
ready
Pure JS Template
$('.purejs_template').autoRender(sharedVariables);
ready
Underscore.js Template
underscoreTemplate(sharedVariables);
ready
JsTpl-0.0.2
jsTpl.render(sharedVariables2);
ready
jsTenjin(converted)
convertedTenjinTemplate.render(sharedVariables2);
ready
nTenjin(converted)
convertednTenjinTemplate.render(sharedVariables2);
ready

Revisions

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