Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Concatenation vs Template String
(version: 0)
Comparing performance of:
Concat vs Template string
Created:
4 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var str = '120';
Tests:
Concat
console.log(str + 'px');
Template string
console.log(`${str}px`);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Concat
Template string
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
7 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/18.5 Safari/605.1.15
Browser/OS:
Safari 18 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=622472" width="100%" height="500px"></iframe>
Concat
1.8M/s
Template string
1.7M/s
View exact numbers
Test name
Executions per second
✓
Concat
1,845,225 Ops/sec
Template string
1,744,812 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks and understand what's being tested on this specific benchmark. **What is being tested?** The benchmark measures the performance difference between two approaches to concatenate strings: 1. **Concatenation using the `+` operator**: This method uses the string concatenation syntax, where two or more values are joined together. 2. **Template literals (Template String)**: This method uses template literals, a feature introduced in ECMAScript 2015, which allows you to embed expressions inside string literals. **Options compared** The benchmark compares the performance of these two approaches on the same input value: `str = '120'`. **Pros and Cons of each approach** 1. **Concatenation using the `+` operator**: * Pros: Simple, widely supported, and easy to understand. * Cons: Can lead to slower performance due to string concatenation, which creates a new string object on each iteration. 2. **Template literals (Template String)**: * Pros: More readable and expressive than traditional string concatenation. Also, template literals create a single string object that can be optimized by the JavaScript engine. * Cons: Requires ECMAScript 2015 support, which might not be present in older browsers or environments. **Library usage** There is no explicit library used in this benchmark. However, it's worth noting that the `console.log()` function is a built-in part of the JavaScript environment and doesn't require any additional libraries. **Special JS feature or syntax** The benchmark uses template literals (Template String), which is a special syntax introduced in ECMAScript 2015. This syntax allows you to embed expressions inside string literals, making it more readable and convenient for concatenating strings. **Other alternatives** If the benchmark didn't use template literals, other alternatives could be: * Using the `String.prototype.concat()` method * Using a custom function for concatenation (e.g., a loop that appends values to a single string) Keep in mind that these alternatives might not provide the same level of expressiveness and performance as template literals. Overall, this benchmark helps measure the performance difference between two common approaches to concatenating strings in JavaScript, making it easier for developers to choose the most efficient method for their specific use cases.
Related benchmarks
concatenation vs template literal
String() vs template literal
string concatenation vs template
concat vs template
Comments
Confirm delete:
Do you really want to delete benchmark?