Benchmark: array iteration vs _.each vs map vs for..of vs for loop

HTML Preparation code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.js"></script>

AخA
 
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.core.js"></script>

Script Preparation code:

var array = ['a', 'b', 'c']

 
var array = ['a', 'b', 'c']

Tests:

_.each
_.each(array, (value, index) => { console.log(value) })
_.each(array, (value, index) => {
console.log(value)
})
forEach
array.forEach((value, index) => { console.log(value) })
array.forEach((value, index) => {
console.log(value)
})

map

array.map((value, index) => {
  console.log(value)
})

 
array.map((value, index) => {  console.log(value)})

for..of
for (const value of array) { console.log(value) }
for (const value of array) {
console.log(value)
}

for loop

for (let i = 0; i < array.length; i++) {
   console.log(array[i])
}

 
for (let i = 0; i < array.length; i++) {   console.log(array[i])}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
_.each
forEach
map
for..of
for loop

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36

Browser/OS: Chrome 135 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
_.each	122271.7 Ops/sec
forEach	126800.3 Ops/sec
map	129714.6 Ops/sec
for..of	140315.2 Ops/sec
for loop	155432.4 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 6 months ago):

Let's break down the provided benchmark and explain what's being tested, the different approaches compared, their pros and cons, and other considerations.

Benchmark Definition

The benchmark is designed to compare the performance of six different ways to iterate over an array:

_.each from the Lodash library
array.forEach
array.map
for..of loop
traditional for loop

Script Preparation Code and Html Preparation Code

The script preparation code creates a sample array array = ['a', 'b', 'c']. The HTML preparation code includes the Lodash library (lodash.core.js) from a CDN.

Test Cases

Each test case represents one of the six iteration methods:

_.each
forEach
map
for..of
traditional for loop
array.forEach

What's being tested?

The benchmark is testing the performance of each iteration method on a sample array. The goal is to determine which method is the fastest and most efficient.

Options Compared

Here's a brief overview of each option:

_.each: A utility function from Lodash that iterates over an array, executing a callback function for each element.
- Pros: Convenient and easy to use, especially when working with nested data structures.
- Cons: May have overhead due to the need for a callback function.
forEach: A built-in method of arrays in JavaScript that iterates over an array, executing a callback function for each element.
- Pros: Fast and efficient, as it's implemented in native code.
- Cons: Limited to iterating over arrays; no support for nested data structures.
map: A built-in method of arrays in JavaScript that creates a new array with the results of applying a given function to every element in the original array.
- Pros: Can be used for both iteration and transformation, making it a versatile option.
- Cons: May have overhead due to the need to create a new array.
for..of: A modern JavaScript loop that iterates over arrays using a for loop syntax.
- Pros: Fast and efficient, as well as easy to read and write.
- Cons: Only available in modern browsers and environments (e.g., Node.js).
traditional for loop: A classic loop construct that iterates over an array using an index variable.
- Pros: Fast and efficient, with minimal overhead.
- Cons: Can be verbose and difficult to read, especially for complex logic.

Pros and Cons

Here's a summary of the pros and cons of each option:

Option	Pros	Cons
_.each	Convenient, easy to use (nested data structures)	Overhead due to callback function
forEach	Fast, efficient	Limited to iterating over arrays
map	Versatile (iteration and transformation), fast	Overhead due to array creation
for..of	Fast, efficient, modern syntax	Only available in modern browsers/Node.js
traditional `for` loop	Fast, efficient, minimal overhead	Verbose, difficult to read

Other Considerations

Lodash's _.each is a convenient option for working with nested data structures, but may have performance implications due to the callback function.
forEach and map can be used for both iteration and transformation, making them more versatile than traditional loops.
for..of is a modern and efficient loop construct, but its availability depends on the browser or environment.

Alternatives

Other alternatives to these options include:

Using filter(), reduce(), and other array methods in combination with forEach or map
Implementing custom iteration logic using recursion or generators
Using third-party libraries like underscore.js (Lodash's alternative) or other polyfills

These are just a few examples, and the best approach will depend on the specific requirements of your project.

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, the different approaches compared, their pros and cons, and other considerations.

**Benchmark Definition**

The benchmark is designed to compare the performance of six different ways to iterate over an array:

1. `_.each` from the Lodash library
2. `array.forEach`
3. `array.map`
4. `for..of` loop
5. traditional `for` loop

**Script Preparation Code and Html Preparation Code**

The script preparation code creates a sample array `array = ['a', 'b', 'c']`. The HTML preparation code includes the Lodash library (`lodash.core.js`) from a CDN.

**Test Cases**

Each test case represents one of the six iteration methods:

1. `_.each`
2. `forEach`
3. `map`
4. `for..of`
5. traditional `for` loop
6. `array.forEach`

**What's being tested?**

The benchmark is testing the performance of each iteration method on a sample array. The goal is to determine which method is the fastest and most efficient.

**Options Compared**

Here's a brief overview of each option:

1. **_.each**: A utility function from Lodash that iterates over an array, executing a callback function for each element.
	* Pros: Convenient and easy to use, especially when working with nested data structures.
	* Cons: May have overhead due to the need for a callback function.
2. **forEach**: A built-in method of arrays in JavaScript that iterates over an array, executing a callback function for each element.
	* Pros: Fast and efficient, as it's implemented in native code.
	* Cons: Limited to iterating over arrays; no support for nested data structures.
3. **map**: A built-in method of arrays in JavaScript that creates a new array with the results of applying a given function to every element in the original array.
	* Pros: Can be used for both iteration and transformation, making it a versatile option.
	* Cons: May have overhead due to the need to create a new array.
4. **for..of**: A modern JavaScript loop that iterates over arrays using a `for` loop syntax.
	* Pros: Fast and efficient, as well as easy to read and write.
	* Cons: Only available in modern browsers and environments (e.g., Node.js).
5. traditional `for` loop: A classic loop construct that iterates over an array using an index variable.
	* Pros: Fast and efficient, with minimal overhead.
	* Cons: Can be verbose and difficult to read, especially for complex logic.

**Pros and Cons**

Here's a summary of the pros and cons of each option:

| Option | Pros | Cons |
| --- | --- | --- |
| _.each | Convenient, easy to use (nested data structures) | Overhead due to callback function |
| forEach | Fast, efficient | Limited to iterating over arrays |
| map | Versatile (iteration and transformation), fast | Overhead due to array creation |
| for..of | Fast, efficient, modern syntax | Only available in modern browsers/Node.js |
| traditional `for` loop | Fast, efficient, minimal overhead | Verbose, difficult to read |

**Other Considerations**

* Lodash's `_.each` is a convenient option for working with nested data structures, but may have performance implications due to the callback function.
* `forEach` and `map` can be used for both iteration and transformation, making them more versatile than traditional loops.
* `for..of` is a modern and efficient loop construct, but its availability depends on the browser or environment.

**Alternatives**

Other alternatives to these options include:

* Using `filter()`, `reduce()`, and other array methods in combination with `forEach` or `map`
* Implementing custom iteration logic using recursion or generators
* Using third-party libraries like underscore.js (Lodash's alternative) or other polyfills

These are just a few examples, and the best approach will depend on the specific requirements of your project.

Related benchmarks:

array iteration vs _.each vs map vs for..of vs for loop (version: 0)

Comparing performance of: _.each vs forEach vs map vs for..of vs for loop

Created: 4 years ago by: Registered User

Jump to the latest result

_.each

forEach

map

for..of