Benchmark: Lodash Object vs Array [immutable vs mutable] [object.keys vs object.entries]

HTML Preparation code:

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

Script Preparation code:

window.arr = [];
window.obj = {};

for (var i = 0, len = 100; i < len; i++) {
    const src = {
        id: 'id-' + i
    };

    obj[src.id] = src;
    arr.push(src);
}

Tests:

obj immutable
_.reduce(obj, (acc, val, key) => { return { ...acc, [key]: val }; }, {});
arr immutable
_.reduce(arr, (acc, val) => { return { ...acc, [val.id]: val }; }, {});
obj mutable
_.reduce(obj, (acc, val, key) => { acc[key] = val; return acc; }, {});
arr mutable
_.reduce(arr, (acc, val) => { acc[val.id] = val; return acc; }, {});
obj keys
const keys = Object.keys(obj); _.reduce(keys, (acc, key) => { acc[key] = obj[key]; return acc; }, {});
obj entries
const pairs = Object.entries(obj); _.reduce(pairs, (acc, [key, val]) => { acc[key] = val; return acc; }, {});

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
obj immutable
arr immutable
obj mutable
arr mutable
obj keys
obj entries

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

**Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks. The provided JSON represents a benchmark test case, which compares the performance of different approaches for reducing an object or array.

**Benchmark Test Case**

The benchmark test case consists of six individual test cases:

1. **"arr mutable"`**: Reduces an array using `_.reduce()` with the second argument being an object that maps each element's id to its value.
2. **"obj mutable"`**: Reduces an object using `_.reduce()` with the same approach as above.
3. **"obj keys"`**: Uses `Object.keys()` to iterate over the object's keys and then reduces it using `_.reduce()`.
4. **"obj entries"`**: Uses `Object.entries()` to get an array of key-value pairs and then reduces it using `_.reduce()`.
5. **"arr immutable"`**: Reduces an array using `_.reduce()` with the first argument being an object that maps each element's id to its value.
6. **"obj immutable"`**: Reduces an object using `_.reduce()` with the same approach as above.

**Comparison of Approaches**

The benchmark tests compare different approaches for reducing objects or arrays:

* **Mutable vs Immutable**: The test case "arr mutable" and "obj mutable" compare reducing an array/object by mapping each element's id to its value, resulting in a new object/array. In contrast, "arr immutable" and "obj immutable" reduce the original array/object without creating a new one.
* **Object.keys() vs Object.entries()**: The test case "obj keys" uses `Object.keys()` to iterate over the object's keys, while "obj entries" uses `Object.entries()` to get an array of key-value pairs. Both approaches are then reduced using `_.reduce()`.

**Pros and Cons**

Here are some pros and cons for each approach:

* **Mutable vs Immutable**:
	+ Pros: May be faster since it avoids creating a new object/array.
	+ Cons: May not preserve the original object/array structure, and may lead to unexpected behavior if the original object/array is modified elsewhere in the code.
* **Object.keys() vs Object.entries()**:
	+ Pros: Using `Object.keys()` can provide better performance since it only iterates over the keys of the object, whereas `Object.entries()` returns an array of key-value pairs. However, using `Object.entries()` can be more convenient when working with objects that need to be processed as arrays.
	+ Cons: None significant in this context.

**Library Used**

The library used for these tests is Lodash (version 4.17.4). Specifically, the `_reduce()` function is used throughout all test cases.

**Special JS Feature/Syntax**

This benchmark does not use any special JavaScript features or syntax that would affect its performance comparison.

**Alternatives**

Other alternatives to Lodash's `_.reduce()` function include:

* Array.prototype.reduce()
* Object.keys().forEach((key, index) => { object[key] = value; })
* Object.entries().forEach(([key, value]) => { object[key] = value; })

However, these alternatives may not provide the same level of performance and convenience as Lodash's `_.reduce()` function.

**Conclusion**

In summary, MeasureThat.net provides a useful benchmark for comparing the performance of different approaches for reducing objects or arrays. The test cases demonstrate that reducing an array or object can have significant performance implications depending on whether it is done in a mutable or immutable way, and using `Object.keys()` or `Object.entries()` as an intermediary step can affect performance.

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.116 Safari/537.36

Browser/OS: Chrome 83 on Linux

View result in a separate tab

Test name	Executions per second
obj immutable	3380.5 Ops/sec
arr immutable	3714.7 Ops/sec
obj mutable	58551.9 Ops/sec
arr mutable	88794.8 Ops/sec
obj keys	25732.2 Ops/sec
obj entries	24579.6 Ops/sec

Related benchmarks:

Lodash Object vs Array [immutable vs mutable] [object.keys vs object.entries] (version: 2)

Comparing performance of: obj immutable vs arr immutable vs obj mutable vs arr mutable vs obj keys vs obj entries

Created: 4 years ago by: Registered User

Jump to the latest result

obj immutable

arr immutable

obj mutable

arr mutable

obj keys

obj entries

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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