Benchmark: lodash vs for-of vs forEach es6

lodash vs for-of vs forEach es6 (version: 0)

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 vs native for-in es6`

Created: 6 years ago by: Guest

Go to the latest result

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]; } }
native for-in es6
for (const prop in obj) { if (prop in obj) { 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
native for-in es6

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

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

Browser/OS: Firefox 141 on Mac OS X 10.15

View result in a separate tab

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

68K/s

native forEach w/ Object.values (no keys)

33K/s

vanilla for-loop w/ Object.keys

18K/s

lodash.each

13K/s

vanilla for-loop w/ Object.entries

7K/s

native forEach w/ entries

7K/s

native for-of w/ entries

7K/s

native for-in es6

1K/s

native for-in

1K/s

View exact numbers

Test name	Executions per second
✓ vanilla for-loop w/ Object.values (no keys)	67,981 Ops/sec
native forEach w/ Object.values (no keys)	33,275 Ops/sec
vanilla for-loop w/ Object.keys	18,465 Ops/sec
lodash.each	13,467 Ops/sec
vanilla for-loop w/ Object.entries	7,224 Ops/sec
native forEach w/ entries	7,018 Ops/sec
native for-of w/ entries	6,766 Ops/sec
native for-in es6	1,494 Ops/sec
native for-in	1,486 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark and explain what's being tested.

**Benchmark Overview**

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

1. `lodash.each`
2. Native `for-of` with `Object.entries`
3. Native `forEach` with `Object.entries`
4. Vanilla for-loop with `Object.keys`

These approaches are compared on a 10,000-element array created using the provided script preparation code.

**Library: Lodash**

`lodash` is a popular JavaScript library that provides a set of utility functions for various tasks. In this benchmark, `_.each` is used to iterate over an object. Lodash's `each` function takes two arguments: the object and a callback function that receives the value and key as arguments.

**Native Features**

The benchmark also uses native features in JavaScript:

* `for-of` loop with `Object.entries`: This syntax was introduced in ECMAScript 2015 (ES6) and allows iterating over arrays and objects using a single loop.
* Native `forEach` with `Object.entries`: Similar to the above, but uses the `forEach` method on an array or object created from `Object.entries`.
* Vanilla for-loop with `Object.keys`: This is a traditional for-loop that uses the `Object.keys()` method to get an array of object property names.

**Approach Comparison**

Here's a brief summary of each approach:

1. **Lodash (`_.each`)**: Lodash provides a convenient way to iterate over objects using its `each` function. This approach is likely to be slow because it involves creating a closure and executing the callback function for each element.
2. **Native `for-of` with `Object.entries`**: This approach takes advantage of the modern JavaScript features introduced in ES6. It's likely to be fast because it uses native code under the hood, which is optimized for performance.
3. **Native `forEach` with `Object.entries`**: Similar to the above, but uses the `forEach` method instead of a traditional loop.
4. **Vanilla for-loop with `Object.keys`**: This approach is traditional and may be slower than the native features due to overhead from using built-in functions.

**Performance Results**

The benchmark shows that the native features (`for-of` and `forEach`) outperform Lodash's `_.each` by a significant margin. The vanilla for-loop is also slower, likely due to the overhead of using built-in functions like `Object.keys`.

In summary, if you need to iterate over an object in JavaScript, use the native `for-of` or `forEach` approaches with `Object.entries`. These are designed to be fast and efficient, taking advantage of modern JavaScript features.

lodash vs for-of vs forEach es6 (version: 0)

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 vs native for-in es6

Created: 6 years ago by: Guest

Go 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

native for-in es6

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

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 vs native for-in es6`