Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
string concat big string
(version: 0)
Comparing performance of:
Join vs Array reduce (how is this so fast?) vs Template literals
Created:
2 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
function generateRandomString(length) { var result = ''; var characters = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; var charactersLength = characters.length; for ( var i = 0; i < length; i++ ) { result += characters.charAt(Math.floor(Math.random() * charactersLength)); } return result; } var arr = " ".repeat(100).split(" ").map(x => generateRandomString(3000));
Tests:
Join
arr.join(", ");
Array reduce (how is this so fast?)
arr.reduce( (s, el) => s+el )
Template literals
`${[...arr]}`
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Join
Array reduce (how is this so fast?)
Template literals
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/122.0.0.0 Safari/537.36
Browser/OS:
Chrome 122 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
Join
620.5 Ops/sec
Array reduce (how is this so fast?)
2046133.6 Ops/sec
Template literals
608.9 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the benchmark and explain what's being tested. **Benchmark Definition JSON** The provided JSON represents a JavaScript microbenchmarking test case. The main part of this object contains the script preparation code, which generates an array `arr` with 100 random strings of varying lengths (each string is a concatenation of a space character followed by a random alphanumeric string). This creates a large dataset for benchmarking. **Options being compared** The benchmark compares three different approaches: 1. **Join**: The `join()` method, which concatenates all elements in the array into a single string using a specified separator. 2. **Array reduce**: The `reduce()` method, which applies a function to each element of the array and reduces it to a single value (in this case, the concatenated string). 3. **Template literals**: A feature introduced in ECMAScript 2015, which allows creating strings with embedded expressions using backticks (`). **Pros and Cons** Here's a brief overview of each approach: 1. **Join**: * Pros: Simple and straightforward, easy to implement. * Cons: Can be slower than other approaches for large datasets due to the overhead of string concatenation. 2. **Array reduce**: * Pros: More efficient than `join()` as it avoids creating intermediate strings. It's also a more functional programming style approach. * Cons: May have higher memory usage due to the accumulator and can be slower for very large datasets. 3. **Template literals**: * Pros: Fast and efficient, especially for smaller datasets. It's also a modern JavaScript feature that provides a concise way of creating strings with embedded expressions. * Cons: Limited support in older browsers and may not be as straightforward to implement. **Library usage** None of the test cases use any external libraries. **Special JS features or syntax** The benchmark uses template literals (`${...}`) for the third test case. Template literals are a feature introduced in ECMAScript 2015, which allows creating strings with embedded expressions using backticks (`). This feature is widely supported by modern browsers and is considered fast and efficient. **Other alternatives** If you were to modify this benchmark to include other approaches, here are some options: 1. **Using `concat()`**: Another way to concatenate array elements would be to use the `concat()` method. 2. **Using a `for` loop**: Instead of using `reduce()`, you could use a traditional `for` loop to iterate over the array and build the concatenated string. 3. **Using a library like Lodash**: If you wanted to explore a more functional programming style approach, you could consider using a library like Lodash, which provides a `join()` function. Keep in mind that modifying this benchmark would require significant changes to the script preparation code and test cases.
Related benchmarks:
Lodash vs vanila 2
Random ID generate
Object.create(null) vs {} vs Map() key access (heavy)
Split vs Spread (randomized)
Comments
Confirm delete:
Do you really want to delete benchmark?