Benchmark: Reduce vs map/join

Script Preparation code:

var strings = [];
for (var i=0; i<1000; i++) {
  strings[i] = ""+i+i;
}

Tests:

for
var result = ""; for (var i=0; i<strings.length; i++) { result = result+' x-'+strings[i]; }
reduce
var result = strings.reduce(function(string, i) { return string+' x-'+i; }, ""); result=result.substring(1);
map
var result = strings.map(function(i) { return 'x-'+i; }).join(' ');
for of
var result = ""; for (var i of strings) { result += ' x-'+i; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
reduce
map
for of

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated 29 days ago):

LLMs can make mistakes. Check important info.

This benchmark compares different ways to achieve the same result in JavaScript: concatenating strings from an array.

**The Goal:**  Imagine you have an array of numbers (in this case, `strings`), and you want to create a new string by adding "x-" before each number in the array and joining them together.

**The Options:**

* **`for` loop:** The classic approach. It iterates through each element in the array, appending "x-" followed by the current element to a `result` string.
* **`reduce` method:** This higher-order function elegantly combines elements of an array into a single value. In this case, it takes a callback function that adds "x-" and the current element to the `string`, accumulating the result. The `.substring(1)` is used to remove the leading 'x-' added in the initial state.
* **`map` and `join`:**  The `map` method transforms each element in the array, adding "x-" before each number. Then, `join(' ')` combines these transformed strings into a single string with spaces between them. 
* **`for...of` loop:** A modern alternative to the traditional `for` loop, offering a more concise way to iterate over iterable objects like arrays.

**Pros & Cons:**

| Method | Pros                                    | Cons                             |
|--------|-----------------------------------------|-----------------------------------|
| `for`   | Simple and easy to understand          | Can be verbose for larger arrays    |
| `reduce` | Concise, efficient for single-value reduction | Might require more mental effort to grasp initially  |
| `map/join` | Readable, good for transforming elements| Slightly less performant than `reduce` in this specific case |
| `for...of` | Modern syntax, clean and readable       | Can be slower than traditional loops in some scenarios |

**Other Considerations:**

* **Readability:** Each method has a different level of readability. Choose the one that is most understandable for your team.

* **Performance:** The results on MeasureThat.net show that `reduce` performs best in this specific case. However, performance can vary depending on the size and complexity of your data.
* **Use Case:** Consider whether you need to transform elements in an array (map) or simply accumulate a single value (reduce).

**Alternatives:**

While these methods work well for string concatenation,  libraries like Lodash offer utility functions that might provide even more concise and efficient solutions depending on your specific needs.

Latest run results:

Run details: (Test run date: 4 days ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:132.0) Gecko/20100101 Firefox/132.0

Browser/OS: Firefox 132 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
for	168313.5 Ops/sec
reduce	100743.4 Ops/sec
map	64524.8 Ops/sec
for of	84459.4 Ops/sec

Related benchmarks:

Reduce vs map/join (version: 0)

Comparing performance of: for vs reduce vs map vs for of

Created: 6 years ago by: Guest

Jump to the latest result

for

reduce

map

for of

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated 29 days ago):