ES6模板文字比字符串连接快吗？

  • Z时代
  • 2024-01-10
  • 分类：问答

在ES6中使用字符串连接或模板文字时，HTML代码生成在现代浏览器中运行的速度是否可测得更快？

例如：

字符串串联

"<body>"+
  "<article>"+
    "<time datetime='" + date.toISOString() +"'>"+ date +"</time>"+
  "</article>"+
"</body>"

模板文字

`<body>
  <article>
    <time datetime='${ date.toISOString() }'>${ date }</time>
  </article>
</body>`

回答：

目前看来，字符串连接速度更快：http : //jsperf.com/es6-string-literals-vs-string-concatenation

ES6 with variable                     19,992,512    ±5.21%    78% slower
String concatenation with variable    89,791,408    ±2.15%    fastest
ES6 with function                     461,358       ±3.12%    99% slower
String concatenation with function    503,255       ±1.77%    99% slower

我测试过的是在#enable-javascript-harmony启用了该标志的V4 4.3.31的Chrome 43.0.2334.0 canary（64位）上运行。

作为参考，Node.js的最新版本（在撰写本文时为0.12.0）正在使用V8 3.28.73：https ://raw.githubusercontent.com/joyent/node/master/ChangeLog

我确信尚未应用所有可能的性能优化，因此可以合理地预期，随着ES6越来越接近最终定稿，并且这些功能已迁移到稳定分支，性能将会提高。

编辑：感谢您的评论@ user1329482，@ icl7126，Nicolai Borisik和FesterCluck。自从提出此问题以来已经过去了大约2年，ES6浏览器支持已大大增加，并且已经进行了大量性能优化。这里有一些更新。

编辑：（2020年2月）基于@JorgeFuentesGonzález注释和后续确认更新了Chrome结果。

在Chrome（自59.0.3035起）中，ES6字符串文字速度更快：

ES6 with variable                     48,161,401       ±1.07%    fastest
String concatenation with variable    27,046,298       ±0.48%    44% slower
ES6 with function                     820,441          ±1.10%    98% slower
String concatenation with function    807,088          ±1.08%    98% slower

更新：在Chrome（自79.0.3945起）中，字符串连接速度更快 …请参阅注释。

在Firefox（从57.0.0版本开始）中，ES6字符串文字速度更快：

ES6 with variable                     1,924,610,984    ±0.50%    fastest
String concatenation with variable    1,876,993,458    ±0.79%    3% slower
ES6 with function                     539,762          ±5.04%    100% slower
String concatenation with function    546,030          ±5.88%    100% slower

在Safari（从11.0.2版开始）中，取决于：

ES6 with variable                     1,382,752,744    ±0.71%    fastest
String concatenation with variable    1,355,512,037    ±0.70%    2% slower
ES6 with function                     876,516          ±1.01%    100% slower
String concatenation with function    883,370          ±0.79%    100% slower

使用类型转换字符串时，ES6字符串文字速度更快。但是，从文字中调用函数时，在此示例中，字符串连接速度更快。

如果您真的想深入了解并且需要从Safari中压缩每一次性能下降，我建议您设置测试以查看是否/如何在字面效果性能内错误键入变量和多个引用。

以上是 ES6模板文字比字符串连接快吗？ 的全部内容， 来源链接： utcz.com/qa/412934.html

回到顶部