Benchmark: lodash vs for-of vs forEach

HTML Preparation code:

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

Script Preparation code:

var obj = Array.from({ length: 10000 }).map((value, i) => i).reduce((val, v) => { val[v] = v; return val; }, {})

Tests:

lodash.each
_.each(obj, function(v,k) {})
native for-of w/ entries
for (const [k, v] of Object.entries(obj)) {}
native forEach w/ entries
Object.entries(obj).forEach(function(v, k) {})
vanilla for-loop w/ Object.keys
const keys = Object.keys(obj); for (let i = 0; i < keys.length; i++) { const v = obj[keys[i]]; }
vanilla for-loop w/ Object.entries
const entries = Object.entries(obj); for (let i = 0; i < entries.length; i++) { const [k, v] = entries[i]; }
vanilla for-loop w/ Object.values (no keys)
const values = Object.values(obj); for (let i = 0; i < values.length; i++){ }
native forEach w/ Object.values (no keys)
Object.values(obj).forEach(function(v) {})
native for-in
for (const prop in obj) { if (obj.hasOwnProperty(prop)) { const v = obj[prop]; } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash.each
native for-of w/ entries
native forEach w/ entries
vanilla for-loop w/ Object.keys
vanilla for-loop w/ Object.entries
vanilla for-loop w/ Object.values (no keys)
native forEach w/ Object.values (no keys)
native for-in

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:133.0) Gecko/20100101 Firefox/133.0

Browser/OS: Firefox 133 on Windows

View result in a separate tab

Test name	Executions per second
lodash.each	5806.3 Ops/sec
native for-of w/ entries	3233.3 Ops/sec
native forEach w/ entries	3932.3 Ops/sec
vanilla for-loop w/ Object.keys	7288.9 Ops/sec
vanilla for-loop w/ Object.entries	3734.1 Ops/sec
vanilla for-loop w/ Object.values (no keys)	29387.9 Ops/sec
native forEach w/ Object.values (no keys)	26946.7 Ops/sec
native for-in	1070.6 Ops/sec

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

LLMs can make mistakes. Check important info.

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

**Benchmark Overview**

The benchmark measures the performance of four different approaches to iterate over an object in JavaScript:

1. `lodash.each`
2. Native `for-of` with `Object.entries` (ES6+)
3. Native `forEach` with `Object.values` (no keys) (ES5-9)
4. Vanilla `for-loop` with `Object.keys`
5. Vanilla `for-loop` with `Object.entries`
6. Vanilla `for-loop` with `Object.values` (no keys)
7. Native `for-in`

**Approaches Comparison**

Here's a brief overview of each approach and their pros and cons:

### 1. `lodash.each`

* Library: Lodash, a popular utility library for JavaScript.
* Purpose: Provides a convenient way to iterate over objects using the `each` function.

Pros:
	+ Convenient and easy-to-use API
	+ Supports iteration over objects, arrays, and maps

Cons:
	+ Adds extra overhead due to the use of an external library
	+ May not be optimized for performance compared to native implementations

### 2. Native `for-of` with `Object.entries`

* Purpose: Iterate over key-value pairs in an object using the `for-of` loop.
* Pros:
	+ Optimized for modern browsers supporting ES6+
	+ Allows iteration over objects, arrays, and maps
	+ Efficient and lightweight

Cons:
	+ Requires support for ES6+ features
	+ May not work in older browsers or environments

### 3. Native `forEach` with `Object.values` (no keys)

* Purpose: Iterate over the values of an object using the `forEach` function.
* Pros:
	+ Optimized for modern browsers supporting ES5-9
	+ Allows iteration over objects, arrays, and maps
	+ Efficient and lightweight

Cons:
	+ Requires support for ES5-9 features
	+ May not work in older browsers or environments
	+ Does not provide direct access to key-value pairs

### 4. Vanilla `for-loop` with `Object.keys`

* Purpose: Iterate over the keys of an object using a traditional `for` loop.
* Pros:
	+ Works in all browsers and environments, including older ones
	+ Allows iteration over objects only
	+ Easy to implement and understand

Cons:
	+ Less efficient than optimized implementations like `for-of` or `forEach`
	+ Requires manual indexing and looping

### 5. Vanilla `for-loop` with `Object.entries`

* Purpose: Iterate over key-value pairs in an object using a traditional `for` loop.
* Pros:
	+ Works in all browsers and environments, including older ones
	+ Allows iteration over objects only
	+ Easy to implement and understand

Cons:
	+ Requires manual indexing and looping
	+ Less efficient than optimized implementations like `for-of`

### 6. Vanilla `for-loop` with `Object.values` (no keys)

* Purpose: Iterate over the values of an object using a traditional `for` loop.
* Pros:
	+ Works in all browsers and environments, including older ones
	+ Allows iteration over objects only
	+ Easy to implement and understand

Cons:
	+ Requires manual indexing and looping
	+ Less efficient than optimized implementations like `forEach`

### 7. Native `for-in`

* Purpose: Iterate over the key-value pairs of an object using the `for-in` loop.
* Pros:
	+ Works in all browsers and environments, including older ones
	+ Allows iteration over objects only

Cons:
	+ Less efficient than optimized implementations like `for-of` or `forEach`
	+ Can be slower due to the use of the `in` operator

**Performance**

The performance results indicate that:

* Native `for-of` with `Object.entries` is the fastest approach, especially in modern browsers.
* Vanilla `for-loop` with `Object.keys`, `Object.values`, or `Object.entries` are relatively slow compared to optimized implementations.
* Lodash's `each` function adds extra overhead and is slower than native implementations.

**Conclusion**

When it comes to iterating over objects in JavaScript, the choice of approach depends on your specific requirements, browser support, and performance considerations. Native `for-of` with `Object.entries` is generally the best option for modern browsers, while vanilla `for-loop` approaches can be used when older browsers or environments are required. Lodash's `each` function should be avoided if performance is a priority.

Related benchmarks:

lodash vs for-of vs forEach (version: 11)

Comparing performance of: lodash.each vs native for-of w/ entries vs native forEach w/ entries vs vanilla for-loop w/ Object.keys vs vanilla for-loop w/ Object.entries vs vanilla for-loop w/ Object.values (no keys) vs native forEach w/ Object.values (no keys) vs native for-in

Created: 6 years ago by: Registered User

Jump to the latest result

lodash.each

native for-of w/ entries

native forEach w/ entries

vanilla for-loop w/ Object.keys

vanilla for-loop w/ Object.entries

vanilla for-loop w/ Object.values (no keys)

native forEach w/ Object.values (no keys)

native for-in

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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