Benchmark: Lodash reduce vs transform vs Native reduce on object

HTML Preparation code:

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

Script Preparation code:

window.obj = {};

for (var i = 0, len = 10; i < len; i++) {
  var arr = []
  obj['key' + i] = arr
  for (var n = 0, len = 10; n < len; n++) {
    arr.push({ ['key' + n]: n });
  }
}

Tests:

Lodash reduce
_.reduce(obj, (acc, val, key) => { acc[key] = val.map(d => ({ label: key, value: val })); return acc; }, {})
Native
Object.entries(obj).reduce((acc, [key, val]) => { acc[key] = val.map(d => ({ label: key, value: val })); return acc; }, {})
Lodash transform
_.transform(obj, (acc, val, key) => { acc[key] = val.map(d => ({ label: key, value: val })); }, {})

Historical Performance Data aggregated from 17 community runs

Desktop Results:

Chrome 17 runs

Lodash transform

1.7M/s

Lodash reduce

1.7M/s

Native

1.6M/s

View exact numbers

✓ Lodash transform: 1,694,174 ops/sec
• Lodash reduce: 1,658,288 ops/sec
• Native: 1,603,119 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash reduce
Native
Lodash transform

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:140.0) Gecko/20100101 Firefox/140.0

Browser/OS: Firefox 140 on Mac OS X 10.15

View result in a separate tab

Lodash reduce

1.7M/s

Lodash transform

1.2M/s

Native

1.1M/s

View exact numbers

Test name	Executions per second
✓ Lodash reduce	1,723,124 Ops/sec
Lodash transform	1,214,118 Ops/sec
Native	1,069,846 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 explanation of the provided benchmark.

**Benchmark Overview**

The benchmark measures the performance of three approaches to transform an object in JavaScript:

1. `_.reduce` (Lodash): uses the `reduce` method from the Lodash library to iterate over the object and transform its values.
2. `Object.entries.reduce`: uses the `entries` method on the `Object` prototype to iterate over the object's key-value pairs, then applies a custom reducer function to transform the values.
3. `_.transform` (Lodash): uses the `transform` method from the Lodash library to iterate over the object and transform its values.

**Options Compared**

The benchmark compares these three approaches:

* **Memory allocation**: Each approach allocates memory for the accumulator (`acc`) and the transformed value (`val`).
* **Array manipulation**: Each approach creates an array of objects, where each object has a `label` and a `value`.
* **Repetition**: The transformation is repeated 10 times for each key-value pair in the original object.

**Pros and Cons**

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

1. **_.reduce (Lodash)**:
	* Pros: concise, readable code; handles nested objects out of the box.
	* Cons: may allocate more memory than necessary due to the accumulator's extra properties.
2. **Object.entries.reduce**:
	* Pros: lightweight, no additional dependencies required.
	* Cons: may be less readable and more error-prone due to its custom reducer function.
3. **_.transform (Lodash)**:
	* Pros: concise, readable code; handles nested objects out of the box.
	* Cons: similar to _.reduce in terms of memory allocation.

**Library Usage**

In this benchmark, Lodash is used for two purposes:

1. `_.reduce` and `_.transform` are part of Lodash's utility functions, which provide a concise way to perform common tasks like reducing an array or transforming an object.
2. The benchmark includes the entire Lodash library as a dependency in the HTML preparation code (`<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>`).

**Special JavaScript Features**

None of the approaches explicitly use special JavaScript features like async/await, promises, or modern syntax (e.g., `const`, `let` without `var`). The code is written in a way that's compatible with older browsers.

**Other Alternatives**

If you need to transform an object in a similar way, here are some alternative approaches:

1. Vanilla JavaScript: use `for...in` loops and array methods like `map()` or `forEach()` to manipulate the object.
2. Other libraries: explore other libraries like Ramda or Liskov's library, which offer functional programming utilities for working with objects.

In summary, this benchmark measures the performance of three approaches to transform an object in JavaScript using Lodash's utility functions. The results can help developers choose the most efficient approach for their specific use case.

Lodash reduce vs transform vs Native reduce on object (version: 0) Benchmark.js

Comparing performance of: `Lodash reduce vs Native vs Lodash transform`

Created: 4 years ago by: Registered User

Go to the latest result

Lodash reduce

Native

Lodash transform

Historical Performance Data aggregated from 17 community runs

Desktop Results:

Chrome 17 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Lodash reduce vs transform vs Native reduce on object (version: 0) Benchmark.js

Comparing performance of: Lodash reduce vs Native vs Lodash transform

Created: 4 years ago by: Registered User

Go to the latest result

Lodash reduce

Native

Lodash transform

Historical Performance Data aggregated from 17 community runs

Desktop Results:

Chrome 17 runs

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 reduce vs Native vs Lodash transform`