Benchmark: lodash/keyBy vs native reduce vs native with spread

HTML Preparation code:

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

Script Preparation code:

var data = [{
        name: 'pi',
        value: 3.14
    },
    {
        name: 'hundred',
        value: 100
    },
    {
        name: 'truthy',
        value: true
    },
    {
        name: 'falsy',
        value: false
    },
    {
        name: 'estring',
        value: '2.71828'
    },
];

var keyBy = (array, fn) => {
    return array.reduce((acc, value) => {
        acc[fn(value)] = value;
        return acc;
    }, {});
};

var keyBySpread = (array, fn) => {
    return array.reduce((acc, value) => ({
        ...acc,
        [fn(value)]: value
    }), {});
};

var keyByForEach = (array, fn) => {
    var acc = {};
    _.forEach(array, (value) => {
        acc[fn(value)] = value;
    });
    return acc;
};

var keyByForLoop = (array, fn) => {
    var acc = {};
    for (let i = 0; i < array.length; i++) {
        acc[fn(array[i])] = array[i];
    }
    return acc;
};

Tests:

lodash/keyBy
_.keyBy(data, (v) => v.name);
keyBy with native reduce
keyBy(data, (v) => v.name);
keyBy with forEach
keyByForEach(data, (v) => v.name);
keyBy with for loop
keyByForLoop(data, (v) => v.name);
KeyBy with spread operator
keyBySpread(data, (v) => v.name);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash/keyBy
keyBy with native reduce
keyBy with forEach
keyBy with for loop
KeyBy with spread operator

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 95 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
lodash/keyBy	3147518.0 Ops/sec
keyBy with native reduce	4158269.8 Ops/sec
keyBy with forEach	2327895.5 Ops/sec
keyBy with for loop	4388728.0 Ops/sec
KeyBy with spread operator	949298.6 Ops/sec

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

LLMs can make mistakes. Check important info.

I'll break down the provided benchmark and explain what's being tested, compared, and its implications.

**Benchmark Overview**

The test measures the performance of four different approaches to create a key-value map from an array of objects:

1. `lodash/keyBy` (Lodash's implementation)
2. `keyBy` with native reduce
3. `keyByForEach` (using Lodash's `forEach` method)
4. `keyByForLoop` (using a traditional for loop)

**What's Being Tested**

Each test case is executed multiple times to measure the execution time per second (`ExecutionsPerSecond`). The results are then compared across different approaches.

**Options Compared**

Here's a brief overview of each approach:

1. **Lodash/keyBy**: Lodash's `keyBy` function uses a combination of reduce and object assignment to create the key-value map.
2. **KeyBy with native reduce**: This approach uses the native `reduce()` method to iterate over the array, creating the key-value map using spread operator (`[...acc, [fn(value), value]]`).
3. **KeyByForEach**: This approach uses Lodash's `forEach` method to iterate over the array, adding each object to the result with its key as the property name.
4. **KeyByForLoop**: This traditional for loop implementation iterates over the array using a traditional loop, assigning each object to the result with its key as the property name.

**Pros and Cons**

Here are some general pros and cons of each approach:

1. **Lodash/keyBy**: Pros: concise, easy to read; Cons: might have overhead due to Lodash's abstraction.
2. **KeyBy with native reduce**: Pros: efficient, native implementation; Cons: might be less readable for those unfamiliar with spread operator usage.
3. **KeyByForEach**: Pros: easy to understand, uses familiar Lodash API; Cons: potentially slower due to function call overhead.
4. **KeyByForLoop**: Pros: traditional loop is well understood; Cons: verbose, error-prone.

**Library and Special JS Features**

The `lodash/keyBy` implementation uses the Lodash library, which provides a concise way to create key-value maps.

There are no special JavaScript features mentioned in this benchmark that aren't already explained above.

**Alternatives**

Other alternatives for creating key-value maps include:

* Using `Array.prototype.reduce()` without spread operator (`acc[fn(value)] = value;`)
* Using `Object.keys()`, `map()`, and `reduce()` (not shown in this benchmark)
* Implementing a custom loop or recursive function

Please note that these alternatives might not be as efficient or readable as the approaches tested in this benchmark.

Overall, this benchmark provides a good comparison of different approaches to creating key-value maps in JavaScript, highlighting the trade-offs between conciseness, readability, and performance.

Related benchmarks:

lodash/keyBy vs native reduce vs native with spread (version: 0)

Comparing performance of: lodash/keyBy vs keyBy with native reduce vs keyBy with forEach vs keyBy with for loop vs KeyBy with spread operator

Created: 3 years ago by: Guest

Jump to the latest result

lodash/keyBy

keyBy with native reduce

keyBy with forEach

keyBy with for loop

KeyBy with spread operator

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):