Benchmark: PlainJS vs Lodash

HTML Preparation code:

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

Script Preparation code:

var myObject = {
  arr1: [[1, 2, 3, 4], [5, 6, 7, 8]],
  arr2: [[1, 2 ,27, 28], [26, 23, 22, 8]],
  arr3: [[7, 9, 11, 12], [14, 15, 16, 17]],
}

var myData = {
  ids: myObject,
  map: {
    1: '1',
    2: '2',
    3: '3',
    4: '4',
    5: '5',
    6: '6',
    7: '7',
    99: '99',
    8: '8',
    9: '9',
    11: '11',
    12: '12',
    13: '13',
    14: '14',
    15: '15',
    16: '16',
    17: '17',
    18: '18',
    19: '19',
    20: '20',
    21: '21',
    22: '22',
    23: '23',
    24: '24',
    25: '25',
    26: '26',
    27: '27',
    28: '28',
    29: '29',
  }
}

Tests:

Lodash
_.pick(myData.map, _(myObject).map(k => k).flatten().flatten().uniq().value())
Plain JS
const createNewMapObj = (oldMap, myObject) => { const retObj = {}; Object.keys(myObject).forEach((k) => { myObject[k].forEach((v) => { v.forEach((v) => { retObj[v] = oldMap[v]; }); }); }); return retObj; } const myNewData = { ids: myObject, map: createNewMapObj(myData.map, myObject), }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash
Plain JS

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**What is being tested?**

The provided benchmark tests two approaches to flatten and select specific values from an object:

1. **Lodash**: The test uses Lodash, a popular JavaScript utility library, to achieve this. Specifically, it utilizes the `_pick` function from Lodash.
2. **Plain JS**: The test creates its own implementation in Plain JavaScript, which manually flattens and selects the desired values.

**Options being compared**

The two options are compared in terms of their performance (number of executions per second) when executing a specific benchmarking expression:

1. `_.pick(myData.map, _(myObject).map(k => k).flatten().flatten().uniq().value())` (Lodash)
2. A custom implementation using Plain JavaScript: `const createNewMapObj = (oldMap, myObject) => {...}`

**Pros and Cons of each approach**

**Lodash**

Pros:

* **Concise code**: Lodash provides a concise and readable way to perform complex operations.
* **Reusable utility functions**: Lodash offers a wide range of pre-built utility functions that can be reused across multiple benchmarks.

Cons:

* **Additional dependencies**: Using Lodash requires loading an external library, which may impact performance or require additional setup.
* **Overhead**: The JavaScript runtime needs to parse and execute the Lodash code, adding some overhead.

**Plain JS**

Pros:

* **No dependencies**: This implementation uses only built-in JavaScript functions, eliminating any dependency on external libraries.
* **Low overhead**: Since it doesn't rely on external libraries or complex parsing, this implementation has lower overhead.

Cons:

* **Verbose code**: The custom implementation is more verbose and requires manual effort to flatten and select values.
* **Error-prone**: Without the safety net of Lodash's error handling, this implementation may be more prone to errors or edge cases.

**Library usage**

In this benchmark, Lodash is used for its `pick` function, which is a convenient way to select specific properties from an object. The `lodash.min.js` library is loaded via a CDN link in the `Html Preparation Code`.

**Special JS features or syntax**

None of the provided code utilizes any special JavaScript features or syntax (e.g., async/await, Promises, arrow functions). However, it's worth noting that the use of `_` notation (e.g., `_(myObject)`) is a shorthand for the Lodash `_.map()` function.

**Other alternatives**

If you were to rewrite this benchmark using other libraries or approaches, some options could be:

* Using the native `Array.prototype.map()` and `Set` objects in Plain JavaScript.
* Employing a library like `lodash-es` (a more modern variant of Lodash) for its utility functions.
* Implementing your own flatten and select logic using other data structure libraries (e.g., `array-union`, `array-flatten`) or algorithms.

Keep in mind that the choice of library or approach depends on your specific use case, performance requirements, and personal preference.

Related benchmarks:

PlainJS vs Lodash (version: 0)

Comparing performance of: Lodash vs Plain JS

Created: 6 years ago by: Registered User

Jump to the latest result

Lodash

Plain JS

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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