Template vs concatanation

Benchmark created by Evaldas on


Preparation HTML

<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

Ready to run.

Testing in
TestOps/sec
Template
var output = template.supplant(data);
ready
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>';
ready
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();
ready

Revisions

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