Benchmark: ES6 equivalent to lodash _.mapValues test

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.20/lodash.min.js"></script>

Tests:

native approach with reduce
var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; console.log(Object.entries(fruits) .reduce((a, [key, { number }]) => { a[key] = number; return a; }, {} ));
native approach fromEntries
var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; console.log(Object.fromEntries( Object.entries(fruits).map(([key, { number }]) => [key, number]) ));
lodash mapValues
var fruits= { 'apple': { 'name': 'apple', 'number': 5}, 'orange': { 'name': 'orange', 'number': 10 } }; console.log(_.mapValues(fruits, 'number'));

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
native approach with reduce
native approach fromEntries
lodash mapValues

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 121 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
native approach with reduce	335127.4 Ops/sec
native approach fromEntries	325093.1 Ops/sec
lodash mapValues	334790.3 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark is testing three approaches to extract values from an object:

1. **Native Approach with Reduce**: Using the `reduce` method on the `Object.entries` array to create a new object with only the value.
2. **Native Approach using fromEntries**: Using the `fromEntries` method on the `Object.entries` array to create a new object with only the value.
3. **Lodash `mapValues`**: Using the `mapValues` function from the Lodash library to extract values from an object.

**Options Compared**

The benchmark is comparing the performance of these three approaches:

* **Native Approach with Reduce**: This method uses the `reduce` method on the `Object.entries` array, which returns a new array. The callback function iterates over the array, creating a new object with only the value.
* **Native Approach using fromEntries**: This method uses the `fromEntries` method on the `Object.entries` array, which returns a new object directly without intermediate steps.
* **Lodash `mapValues`**: This method uses the `mapValues` function from the Lodash library to extract values from an object.

**Pros and Cons**

Here's a brief summary of each approach:

* **Native Approach with Reduce**:
	+ Pros: Portable, easy to understand, and widely supported.
	+ Cons: May be slower due to the use of `reduce`, which can be optimized in newer browsers.
* **Native Approach using fromEntries**:
	+ Pros: Fast, concise, and efficient.
	+ Cons: Requires support for `fromEntries` in the browser or engine.
* **Lodash `mapValues`**:
	+ Pros: Efficient, readable, and widely used library function.
	+ Cons: Adds external dependency (Lodash), which may not be desirable in all cases.

**Library and Special JS Features**

In this benchmark, Lodash is used as a library to provide the `mapValues` function. There are no special JavaScript features or syntax being tested.

**Other Alternatives**

If you need to extract values from an object without using `reduce`, `fromEntries`, or a library like Lodash, you can use other approaches:

* Using a simple loop: Iterate over the `Object.entries` array and create a new object with only the value.
* Using `forEach`: Iterate over the `Object.entries` array and create a new object with only the value using the `forEach` method.

Here's an example of how you could implement this approach:
```javascript
const fruits = {
  'apple': { name: 'apple', number: 5 },
  'orange': { name: 'orange', number: 10 }
};

const result = {};

Object.entries(fruits).forEach(([key, value]) => {
  result[key] = value.number;
});

console.log(result);
```
This approach is more verbose than the native approaches but can be a viable alternative in certain situations.

Related benchmarks:

ES6 equivalent to lodash _.mapValues test (version: 0)

Comparing performance of: native approach with reduce vs native approach fromEntries vs lodash mapValues

Created: 5 years ago by: Guest

Jump to the latest result

native approach with reduce

native approach fromEntries

lodash mapValues

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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