Template vs concatanation

JavaScript performance comparison

Test case created by Evaldas

Preparation code

<script>
  String.prototype.supplant = function(o) {
   return this.replace(/{([^{}]*)}/g, function(a, b) {
    var r = o[b];
    return typeof r === 'string' || typeof r === 'number' ? r : a;
   });
  };
  
  var template = '<tr><td>{title}</td><td>{type}</td><td><a href="tags/{tag}">{tag}</a></td><td>{created_at}</td></tr>';
  
  var data = {
   title: 'title',
   type: 'type',
   tag: 'tag',
   created_at: 'created_at'
  };
</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
Template
var output = template.supplant(data);
pending…
Concatenation
var output = '<tr><td>' + data.title + '</td><td>' + data.type + '</td><td><a href="tags/' + data.tag + '">' + data.tag + '</a></td><td>' + data.created_at + '</td></tr>';
pending…
Array join
var output = ['<tr><td>', data.title, '</td><td>', data.type, '</td><td><a href="tags/', data.tag, '">', data.tag, '</a></td><td>', data.created_at, '</td></tr>'].join();
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