jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.

jsperf.com URLs are mirrored at the same path, e.g:

https://jsperf.com/negative-modulo/2

Can be accessed at:

https://jsperf.app/negative-modulo/2

DOM vs doT.js (v5)

Revision 5 of this benchmark created on August 4, 2014

Preparation HTML

<html>
<head></head>
<body>
<div id="dot-template" style="display: none">
  {{~it :value:index}}
    <div id="item{{=index+1}}" class="block selectable">
      <a data-language="{{=value.title}}">
        <div class="block-img loading">
          <img src="{{=value.img}}">
        </div>
        <div class="block-title">{{=value.body}}</div>
      </a>
    </div>
  {{~}}
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="//rawgit.com/olado/doT/master/doT.min.js"></script>
<script>
  var tplDiv = document.getElementById('dot-template');
  var dotTemplate = doT.compile(tplDiv.innerHTML);
</script>
<script>
  function dotJoined(it) {
    var out = [];
    out.push(' ');
    var arr1 = it;
    if (arr1) {
      var value, index = -1, l1 = arr1.length - 1;
      while (index < l1) {
        value = arr1[index += 1];
        out.push(
          ' <div id="item',
          index + 1,
          '" class="block selectable"> <a data-language="',
          value.title,
          '"> <div class="block-img loading"> <img src="',
          value.img,
          '"> </div> <div class="block-title">',
          value.body,
          '</div> </a> </div> '
        );
      }
      out.push(' ');
      return out.join('');
    }
  }
</script>
<div id="content"></div>
</body>
</html>

Setup

var content = [
        {title: "eng", body: "English", img:"http://www.gemini.edu/images/stories/press_release/pr2008-6/fig1.jpg"},
        {title: "ita", body: "Italian", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13117_ip.jpg"},
        {title: "fra", body: "French", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13109_ip.jpg"},
        {title: "spa", body: "Spanish", img:"http://images.nrao.edu/images/cnd_1cm_irac_rgb_lo.jpg"},
        {title: "jpn", body: "Japanese", img:"http://cdn2.sbnation.com/entry_photo_images/7158791/sandy_large_verge_medium_portrait.jpg"},
        {title: "ara", body: "Arabic", img:"http://www.vmapas.com/maps/2748-2/Satellite_Image_Western_World.jpg"},
        {title: "deu", body: "German", img:"http://www.dailygalaxy.com/.a/6a00d8341bf7f753ef0168e8769a26970c-500wi"},
        {title: "zho", body: "Chinese", img:"http://blogs.voanews.com/science-world/files/2011/12/neptune.gif"},
        {title: "rus", body: "Russian", img:"http://www.noao.edu/image_gallery/images/d4/J1337-29_crop1-500.jpg"},
        {title: "por", body: "Portugal", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13064_ip.jpg"},
        {title: "eng", body: "English", img:"http://www.gemini.edu/images/stories/press_release/pr2008-6/fig1.jpg"},
        {title: "ita", body: "Italian", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13117_ip.jpg"},
        {title: "fra", body: "French", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13109_ip.jpg"},
        {title: "spa", body: "Spanish", img:"http://images.nrao.edu/images/cnd_1cm_irac_rgb_lo.jpg"},
        {title: "jpn", body: "Japanese", img:"http://cdn2.sbnation.com/entry_photo_images/7158791/sandy_large_verge_medium_portrait.jpg"},
        {title: "ara", body: "Arabic", img:"http://www.vmapas.com/maps/2748-2/Satellite_Image_Western_World.jpg"},
        {title: "deu", body: "German", img:"http://www.dailygalaxy.com/.a/6a00d8341bf7f753ef0168e8769a26970c-500wi"},
        {title: "zho", body: "Chinese", img:"http://blogs.voanews.com/science-world/files/2011/12/neptune.gif"},
        {title: "rus", body: "Russian", img:"http://www.noao.edu/image_gallery/images/d4/J1337-29_crop1-500.jpg"},
        {title: "por", body: "Portugal", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13064_ip.jpg"},
        {title: "eng", body: "English", img:"http://www.gemini.edu/images/stories/press_release/pr2008-6/fig1.jpg"},
        {title: "ita", body: "Italian", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13117_ip.jpg"},
        {title: "fra", body: "French", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13109_ip.jpg"},
        {title: "spa", body: "Spanish", img:"http://images.nrao.edu/images/cnd_1cm_irac_rgb_lo.jpg"},
        {title: "jpn", body: "Japanese", img:"http://cdn2.sbnation.com/entry_photo_images/7158791/sandy_large_verge_medium_portrait.jpg"},
        {title: "ara", body: "Arabic", img:"http://www.vmapas.com/maps/2748-2/Satellite_Image_Western_World.jpg"},
        {title: "deu", body: "German", img:"http://www.dailygalaxy.com/.a/6a00d8341bf7f753ef0168e8769a26970c-500wi"},
        {title: "zho", body: "Chinese", img:"http://blogs.voanews.com/science-world/files/2011/12/neptune.gif"},
        {title: "rus", body: "Russian", img:"http://www.noao.edu/image_gallery/images/d4/J1337-29_crop1-500.jpg"},
        {title: "por", body: "Portugal", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13064_ip.jpg"},
        {title: "eng", body: "English", img:"http://www.gemini.edu/images/stories/press_release/pr2008-6/fig1.jpg"},
        {title: "ita", body: "Italian", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13117_ip.jpg"},
        {title: "fra", body: "French", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13109_ip.jpg"},
        {title: "spa", body: "Spanish", img:"http://images.nrao.edu/images/cnd_1cm_irac_rgb_lo.jpg"},
        {title: "jpn", body: "Japanese", img:"http://cdn2.sbnation.com/entry_photo_images/7158791/sandy_large_verge_medium_portrait.jpg"},
        {title: "ara", body: "Arabic", img:"http://www.vmapas.com/maps/2748-2/Satellite_Image_Western_World.jpg"},
        {title: "deu", body: "German", img:"http://www.dailygalaxy.com/.a/6a00d8341bf7f753ef0168e8769a26970c-500wi"},
        {title: "zho", body: "Chinese", img:"http://blogs.voanews.com/science-world/files/2011/12/neptune.gif"},
        {title: "rus", body: "Russian", img:"http://www.noao.edu/image_gallery/images/d4/J1337-29_crop1-500.jpg"},
        {title: "por", body: "Portugal", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13064_ip.jpg"},
        {title: "eng", body: "English", img:"http://www.gemini.edu/images/stories/press_release/pr2008-6/fig1.jpg"},
        {title: "ita", body: "Italian", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13117_ip.jpg"},
        {title: "fra", body: "French", img:"http://photojournal.jpl.nasa.gov/ipbrowse/PIA13109_ip.jpg"},
        {title: "spa", body: "Spanish", img:"http://images.nrao.edu/images/cnd_1cm_irac_rgb_lo.jpg"},
        {title: "jpn", body: "Japanese", img:"http://cdn2.sbnation.com/entry_photo_images/7158791/sandy_large_verge_medium_portrait.jpg"},
        {title: "ara", body: "Arabic", img:"http://www.vmapas.com/maps/2748-2/Satellite_Image_Western_World.jpg"},
        {title: "deu", body: "German", img:"http://www.dailygalaxy.com/.a/6a00d8341bf7f753ef0168e8769a26970c-500wi"},
        {title: "zho", body: "Chinese", img:"http://blogs.voanews.com/science-world/files/2011/12/neptune.gif"},
        {title: "rus", body: "Russian", img:"http://www.noao.edu/image_gallery/images/d4/J1337-29_crop1-500.jpg"}
    ];

Teardown


    $('#content').empty();

Test runner

Ready to run.

Test Ops/sec

DOM

Testing in
Test	Ops/sec
DOM	var frag = document.createDocumentFragment(); for (var i = 0, l = content.length; i < l; ++i) { var div1 = document.createElement('div'); var a = document.createElement('a'); var div2 = document.createElement('div'); var img = document.createElement('img'); var div3 = document.createElement('div'); div1.id = 'item' + (i + 1); div1.className = 'block selectable'; a.setAttribute('data-language', content[i].title); div2.className = 'block-img loading'; img.setAttribute('src', content[i].img); div3.className = 'block-title'; div3.appendChild(document.createTextNode(content[i].body)); div2.appendChild(img); a.appendChild(div2); a.appendChild(div3); div1.appendChild(a); frag.appendChild(div1); } document.getElementById('content').appendChild(frag);	ready
doT	`document.getElementById('content').innerHTML = dotTemplate(content);`	ready
doT joined	`document.getElementById('content').innerHTML = dotJoined(content);`	ready

var frag = document.createDocumentFragment();
for (var i = 0, l = content.length; i < l; ++i) {
  var div1 = document.createElement('div');
  var a = document.createElement('a');
  var div2 = document.createElement('div');
  var img = document.createElement('img');
  var div3 = document.createElement('div');
  div1.id = 'item' + (i + 1);
  div1.className = 'block selectable';
  a.setAttribute('data-language', content[i].title);
  div2.className = 'block-img loading';
  img.setAttribute('src', content[i].img);
  div3.className = 'block-title';
  div3.appendChild(document.createTextNode(content[i].body));
  div2.appendChild(img);
  a.appendChild(div2);
  a.appendChild(div3);
  div1.appendChild(a);
  frag.appendChild(div1);
}
document.getElementById('content').appendChild(frag);

ready

doT

document.getElementById('content').innerHTML = dotTemplate(content);

ready

doT joined

document.getElementById('content').innerHTML = dotJoined(content);

ready

Revisions

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

Revision 1: published by Manuel on April 10, 2013
Revision 2: published on January 16, 2014
Revision 3: published on May 14, 2014
Revision 4: published on May 14, 2014
Revision 5: published on August 4, 2014