Benchmark: lodash forEach vs for i loop with length cached vs Array#forEach vs Array#map (big array 1e4)

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/lodash/4.16.0/lodash.min.js"></script>

Script Preparation code:

var values = Array.from({length: 1e4}).map((v, i) => ({ [String.fromCharCode(Math.random() * 26 + 97)]: Math.random(10000) }))

Tests:

lodash.forEach
var count = 0; _.forEach(values, function(v,i) { if (v.a != null) { count++; } })
native
var count = 0; for (var i = 0, len = values.length; i < len; i++) { if (values[i].a != null) { count++; } }
Array#forEach
var count = 0; values.forEach(function(v,i) { if (v.a != null) { count++; } })
Array#map
var count = 0; values.map(function(v,i) { if (v.a != null) { count++; } })

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash.forEach
native
Array#forEach
Array#map

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):

LLMs can make mistakes. Check important info.

Let's dive into the Benchmark Definition and test cases.

**Overview**

The provided benchmark, MeasureThat.net, tests four approaches to iterating over an array in JavaScript:

1. Lodash `forEach`
2. Native `for` loop with length caching
3. Array `.forEach()` method
4. Array `.map()` method

Each approach is compared against the others to determine which one is the most efficient.

**Approaches and their characteristics**

### 1. Lodash `forEach`

* Library: Lodash (a utility library for functional programming)
* Purpose: Provides a concise way to iterate over an array, applying a function to each element.
* Pros:
	+ Concise syntax
	+ Easy to use and understand
	+ Works with both arrays and objects
* Cons:
	+ Adds additional overhead due to the library's functionality

### 2. Native `for` loop with length caching

* Purpose: Uses a traditional `for` loop to iterate over an array, taking advantage of caching the array's length.
* Pros:
	+ Fastest execution speed among all approaches
	+ Simple and familiar syntax for many developers
	+ No additional overhead beyond the basic `for` loop functionality
* Cons:
	+ Requires manual indexing and bounds checking
	+ May require more code to achieve the same result as other approaches

### 3. Array `.forEach()`

* Purpose: A built-in method for iterating over an array, applying a function to each element.
* Pros:
	+ Fast execution speed (similar to native `for` loop)
	+ Simple and concise syntax
	+ Easy to use and understand
* Cons:
	+ May have slight overhead due to the browser's or interpreter's implementation

### 4. Array `.map()`

* Purpose: A built-in method for transforming an array by applying a function to each element.
* Pros:
	+ Fast execution speed (similar to native `for` loop)
	+ Simple and concise syntax
	+ Easy to use and understand
* Cons:
	+ Not designed for iteration only, but can be adapted for that purpose

**Special considerations**

In this benchmark, no special JavaScript features or syntax are used beyond the basic language features. However, the use of Lodash library in one of the test cases introduces additional complexity.

**Other alternatives**

If you're interested in exploring alternative approaches to iterating over arrays in JavaScript, consider:

* Using `reduce()` instead of `forEach()`
* Implementing your own iterator using a `for...of` loop and caching the array's length
* Utilizing Web Workers for concurrent processing
* Leveraging modern frameworks or libraries (e.g., React, Angular) that optimize array iteration

Keep in mind that each approach has its trade-offs, and the best choice depends on your specific use case and performance requirements.

I hope this explanation helps!

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3895.5 Safari/537.36

Browser/OS: Chrome 78 on Windows

View result in a separate tab

Test name	Executions per second
lodash.forEach	2586.8 Ops/sec
native	569.1 Ops/sec
Array#forEach	3041.9 Ops/sec
Array#map	627.5 Ops/sec

Related benchmarks:

lodash forEach vs for i loop with length cached vs Array#forEach vs Array#map (big array 1e4) (version: 0)

Comparing performance of: lodash.forEach vs native vs Array#forEach vs Array#map

Created: 5 years ago by: Guest

Jump to the latest result

lodash.forEach

native

Array#forEach

Array#map

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 29 days ago):