Benchmark: Array.reduce vs for loop vs Array.forEach vs lodash reduce

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

// Create an array of 1000 random intergers between 1 and 10000
var arrRandom = [];
for(var intCtr=0; intCtr<1000; intCtr++) {
  arrRandom.push(Math.floor(Math.random() * Math.floor(10000)));
}

function reduceCallback(accum, curr) {
	return accum+curr;
}

function doRedeuce(pArray) {
	return pArray.reduce(reduceCallback);
}
function doLoop(pArray) {
	var accum = 0;
	for(var intCtr=0; intCtr<pArray.length; intCtr++) {
		accum += pArray[intCtr];
	}
	return accum;
}
function doForEach(pArray) {
	var accum = 0;
	pArray.forEach(function(item) {
		accum += item;
	});
}

function doLodashReduce(pArray) {
  	return _.reduce(pArray, reduceCallback);
}

Tests:

reduce
var redeuceResult=0; redeuceResult = doRedeuce(arrRandom);
for loop
var loopResult=0; loopResult = doLoop(arrRandom);
forEach
var forEachResult=0 forEachResult = doForEach(arrRandom)
lodash reduce
var redeuceResult=0; lodashRedeuceResult = doLodashReduce(arrRandom);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reduce
for loop
forEach
lodash reduce

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 years ago)

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 14_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/14.1 Mobile/15E148 Safari/604.1

Browser/OS: Mobile Safari 14 on iOS 14.5.1

View result in a separate tab

Test name	Executions per second
reduce	617293.4 Ops/sec
for loop	1098817.2 Ops/sec
forEach	289986.3 Ops/sec
lodash reduce	525640.3 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated one month ago):

LLMs can make mistakes. Check important info.

I'll break down what's being tested in the provided benchmark.

**Overview**

The benchmark compares the performance of four different approaches to sum an array of 1000 random integers between 1 and 10,000:

1. `Array.prototype.reduce()`
2. For loop
3. `Array.prototype.forEach()`
4. Lodash's `reduce()` function

**Options Compared**

Here are the options being compared:

* **`Array.prototype.reduce()`**: This method takes a callback function as an argument, which is executed for each element in the array, and returns a new array with the accumulated results.
* **For loop**: A traditional, iterative approach using a `for` loop to iterate over the array elements and accumulate the sum.
* **`Array.prototype.forEach()`**: This method executes a callback function once for each element in the array, but does not return any value or accumulate results.
* **Lodash's `reduce()` function**: A higher-order function that takes an initial value (not specified in this benchmark), a callback function, and an array as arguments. It returns the accumulated result.

**Pros and Cons of Each Approach**

Here are some pros and cons for each approach:

* **`Array.prototype.reduce()`**:
	+ Pros: Efficient, concise, and scalable.
	+ Cons: Can be slower than other approaches for small arrays due to overhead from the callback function.
* **For loop**:
	+ Pros: Easy to understand, control over iteration, and no additional dependencies.
	+ Cons: More verbose, prone to errors, and can be less efficient than other methods.
* **`Array.prototype.forEach()`**:
	+ Pros: Simple, easy to read, and does not require accumulating results.
	+ Cons: Does not return any value, making it unsuitable for this specific use case.
* **Lodash's `reduce()` function**:
	+ Pros: High-level abstraction, efficient, and flexible.
	+ Cons: Additional dependency (Lodash), potentially slower due to overhead from the library.

**Special JavaScript Features or Syntax**

The benchmark does not explicitly use any special JavaScript features or syntax beyond what is standard in modern browsers. However, it's worth noting that some older browsers may have issues with `forEach()` or other modern methods.

**Library: Lodash**

Lodash is a popular utility library for JavaScript that provides numerous functions for common tasks, including array manipulation (e.g., `reduce()`, `forEach()`). In this benchmark, Lodash's `reduce()` function is used to compare its performance with the built-in `Array.prototype.reduce()` method.

**Alternatives**

If you prefer not to use a library or built-in methods like `forEach()`, other alternatives for summing an array of numbers include:

* Using a traditional loop with a variable accumulator
* Employing a recursive function
* Utilizing a specialized library like Underscore.js (similar to Lodash)
* Leveraging a just-in-time (JIT) compiler or engine to optimize performance

Keep in mind that the choice of approach ultimately depends on your specific requirements, code readability, and personal preference.

Related benchmarks:

Array.reduce vs for loop vs Array.forEach vs lodash reduce (version: 0)

A test summing 1000 random numbers, 1 - 10000

Comparing performance of: reduce vs for loop vs forEach vs lodash reduce

Created: 3 years ago by: Guest

Jump to the latest result

reduce

for loop

forEach

lodash reduce

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated one month ago):