ES6 String Literals vs. String Concatenation

JavaScript performance comparison

Revision 34 of this test case created by Brett Larson

Preparation code


      
      <script>
Benchmark.prototype.setup = function() {
  var precalculatedIso = (new Date()).toISOString();
  
  function tagger(str) { 
   return `<body>
    <article>
      <time datetime='${ str[0] }'>${ str[0] }</time>
    </article>
   </body>`
  }
  
  function tagger2(str) { 
   return "<body>"+
    "<article>"+
      "<time datetime='" + str[0] +"'>"+ str[0] +"</time>"+
    "</article>"+
  "</body>";
  }

};
</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
String concatenation with function
var test = "<body>"+
  "<article>"+
    "<time datetime='" + (new Date()).toISOString() +"'>"+ (new Date()).toISOString() +"</time>"+
  "</article>"+
"</body>";
pending…
ES6 with variable
var test = `<body>
  <article>
    <time datetime='${ precalculatedIso }'>${ precalculatedIso }</time>
  </article>
</body>`;
pending…
String concatenation with variable
var test = "<body>"+
  "<article>"+
    "<time datetime='" + precalculatedIso +"'>"+ precalculatedIso +"</time>"+
  "</article>"+
"</body>";
pending…
tagged template 2
var test = tagger2`precalculatedIso`
pending…
ES6 with function
var test = `<body>
  <article>
    <time datetime='${ (new Date()).toISOString() }'>${ (new Date()).toISOString() }</time>
  </article>
</body>`;
pending…
tagged template
var test = tagger`precalculatedIso`
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