Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
for vs. for-of vs. join vs. reduce (concat strings)
(version: 0)
Benchmark.js
Join an array of strings into one string.
Comparing performance of:
for loop vs for-of loop vs join vs reduce
Created:
4 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var strings = Array(100).fill("savemyhomeinthe(jungle|polar|ocean|desert)")
Tests:
for loop
let result = "" for (let i = 0; i < strings.length; i++) { result += strings[i] }
for-of loop
let result = "" for (const string of strings) { result += string }
join
const result = strings.join("")
reduce
const result = strings.reduce((a, b) => a + b, "")
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (4)
Previous results
Fork
Test case name
Result
for loop
for-of loop
join
reduce
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/128.0.0.0 Safari/537.36
Browser/OS:
Chrome 128 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=554712" width="100%" height="500px"></iframe>
reduce
2.9M/s
for-of loop
2.7M/s
join
1.4M/s
for loop
139K/s
View exact numbers
Test name
Executions per second
✓
reduce
2,912,310 Ops/sec
for-of loop
2,740,354 Ops/sec
join
1,404,527 Ops/sec
for loop
138,825 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down what's being tested in the provided benchmark. **Overview** The benchmark is designed to compare the performance of different approaches to concatenate an array of strings into a single string: 1. `for` loop 2. `for-of` loop (also known as "forEach" loop) 3. `join()` method 4. `reduce()` method with a callback function **For Loop** The for loop approach uses a traditional `for` loop to iterate over the array of strings, concatenating each string to a result variable. Pros: * Wide support across browsers and versions * Easy to understand and implement Cons: * Can be slower than other approaches due to the overhead of the loop counter and the need to increment it manually **For-Of Loop** The for-of loop approach uses a `for-of` loop, which is similar to an array iteration but with some key differences. Instead of using a loop counter, the `for-of` loop iterates over the values in the array directly. Pros: * Can be faster than traditional `for` loops since it avoids the overhead of a loop counter * More concise and expressive syntax Cons: * Not all browsers support `for-of` loops, although most modern versions do * May have slightly different behavior due to differences in iteration order or handling of null/undefined values **Join() Method** The join() method approach uses the built-in `join()` method of arrays, which concatenates all elements in an array into a single string. Pros: * Fast and efficient since it's implemented in native code * Wide support across browsers and versions * Concise syntax Cons: * May not work as expected with null or undefined values in the array * Can only concatenate strings; if you need to concatenate non-string values, you'll need to convert them to strings first **Reduce() Method** The reduce() method approach uses the `reduce()` method of arrays, which applies a callback function to each element in an array, reducing it to a single output value. Pros: * Can be used for more complex concatenation operations that involve multiple steps * Wide support across browsers and versions * Concise syntax Cons: * May have performance issues if the callback function is computationally expensive * Requires manual conversion of non-string values to strings, which can be error-prone **Library Used: None** There are no libraries used in this benchmark. The `join()` method is a built-in array method, and the `reduce()` method is also implemented as part of the JavaScript standard library. **Special JS Feature: None** This benchmark does not use any special JavaScript features or syntax that would require explanation beyond what's covered above. **Other Alternatives** Some alternative approaches to concatenating strings in JavaScript include: * Using a string interpolation technique, such as using `template literals` (introduced in ECMAScript 2015) * Using the `StringBuilder` class from the `util` module (in Node.js) * Writing a custom string concatenation function that avoids using built-in methods like `join()` or `reduce()` However, these alternatives are not included in this benchmark.
Related benchmarks
Array<string>.join vs Array<string>.reduce
map and join vs reduce
map and join vs reduce small array
string array join vs for loop concatenation
Comments
Confirm delete:
Do you really want to delete benchmark?