Benchmark: Lodash pick vs es pick vs native version 2

HTML Preparation code:

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

Script Preparation code:

var pick1 = (originalObj = {}, keysToPick = []) =>
    Object.fromEntries(
        Object.entries(originalObj)
        .filter(([key]) => keysToPick.includes(key))
    )

var pick2 = new Function('obj', 'return { a: obj.a, d: obj.d, i: obj.i };');

Tests:

Lodash
const obj = { a:1, b:1, c:1, d:1, e:1, f:1, g:1, h:1, i:1, } const n = _.pick(obj, ['a','d','i']);
Object desctruct
const obj = { a:1, b:1, c:1, d:1, e:1, f:1, g:1, h:1, i:1, } const n = pick1(obj, ['a','d','i']);
compiled function
const obj = { a:1, b:1, c:1, d:1, e:1, f:1, g:1, h:1, i:1, } const n = pick2(obj)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash
Object desctruct
compiled function

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.

Measuring JavaScript performance has become increasingly important in the development of web applications, and MeasuringThat.net is an excellent platform for benchmarking various libraries and implementations.

The provided JSON represents a benchmark test that compares three approaches to pick specific properties from an object:

1.  **Lodash (pick)**: This approach uses the popular Lodash library to perform the operation.
2.  **Native ES6/ES7 (Object destructuring)**: This approach utilizes the native JavaScript syntax for object destructuring, which was introduced in ECMAScript 2015 (ES6).
3.  **Compiled function**: This approach uses a precompiled JavaScript function that is executed directly on the browser.

**Options Compared**

The three approaches are compared in terms of their execution performance, measured by the number of executions per second (ExecutionsPerSecond).

**Pros and Cons of Each Approach:**

*   **Lodash (pick)**:
    *   Pros:
        *   Easy to use and maintain.
        *   Well-tested and widely adopted library.
    *   Cons:
        *   Adding an extra dependency, which may slow down page load times.
        *   May not be optimized for performance, as it's a complex library with many features.
*   **Native ES6/ES7 (Object destructuring)**:
    *   Pros:
        *   No additional dependencies or overhead.
        *   Optimized for performance and concise syntax.
    *   Cons:
        *   Requires modern JavaScript engines to support the syntax.
        *   May not be familiar to developers without experience with ES6/ES7 features.
*   **Compiled function**:
    *   Pros:
        *   Precompiled, which can result in better performance optimization.
        *   No dependencies or overhead.
    *   Cons:
        *   Requires manual compilation and maintenance.
        *   May be less flexible than other approaches.

**Library and Purpose:**

The Lodash library is a popular JavaScript utility library that provides a wide range of functions for tasks such as array manipulation, object transformation, and more. The `pick` function in particular is useful for extracting specific properties from an object.

**Special JS Features/Syntax:**

*   **Object Destructuring (Native ES6/ES7)**: This feature allows for concise syntax to extract properties from objects. It's a modern JavaScript feature that was introduced in ECMAScript 2015 (ES6) and is widely supported by modern browsers.
    *   Example:
        ```javascript
const { a, d, i } = obj;
```

**Other Alternatives:**

If you're interested in exploring other approaches or alternatives, here are some options:

*   **Native JavaScript (Object creation)**: Instead of using `Object.fromEntries`, you could use the spread operator (`...`) to create a new object with selected properties.
    ```javascript
const { a, d, i } = obj;
const newObject = { ...obj, a, d, i };
```
*   **Other libraries**: Depending on your specific requirements, you might want to explore other libraries like `ujs` or ` js-structure`, which provide similar functionality for working with objects.

Keep in mind that each approach has its pros and cons, and the choice ultimately depends on your project's specific needs, performance requirements, and personal preferences.

Related benchmarks:

Lodash pick vs es pick vs native version 2 (version: 0)

Comparing performance of: Lodash vs Object desctruct vs compiled function

Created: 4 years ago by: Guest

Jump to the latest result

Lodash

Object desctruct

compiled function

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