Benchmark: Destructuring test!

Script Preparation code:

var a = {bla: 1, heyo: 2, afdsda: 3, innerRef: 4, ad: 5};
var b = {hasFocusPriority: 1, heyo: 2, afdsda: 3, innerRef: 4, ad: 5};
var c = {hasFocusPriority: 1, ref: 2, onFocus: 3, innerRef: 4, onNativeBlur: 5};

function _objectWithoutPropertiesLoose(source, excluded) {
    if (source == null) return {};
    var target = {};
    var sourceKeys = Object.keys(source);
    var key, i;
    for (i = 0; i < sourceKeys.length; i++) {
        key = sourceKeys[i];
        if (excluded.indexOf(key) >= 0) continue;
        target[key] = source[key];
    }
    return target;
}

function _altGenerated(target, source, excluded) {
    for (var key in source) {
        if (!excluded(key)) target[key] = source[key];
    }
    return target;
}

function destructure(props) {
    return Object.assign(
        {ref: 1, onFocus: 2, onBlur: 3},
        _objectWithoutPropertiesLoose(props, [
            'innerRef',
            'hasFocusPriority',
            'ref',
            'onFocus',
            'onBlur',
            'onNativeFocus',
            'onNativeBlur',
        ])
    );
}

function destructureAlt(props) {
    return _altGenerated(
        {ref: 1, onFocus: 2, onBlur: 3},
        props,
        key =>
            key === 'innerRef' ||
            key === 'hasFocusPriority' ||
            key === 'ref' ||
            key === 'onFocus' ||
            key === 'onBlur' ||
            key === 'onNativeFocus' ||
            key === 'onNativeBlur'
    );
}

function manual(props) {
    var childProps = {
        ref: 1,
        onFocus: 2,
        onBlur: 3,
    };

    for (let key in props) {
        switch (key) {
        case 'innerRef':
        case 'hasFocusPriority':
        case 'ref': // I do not know if this one could happen
        case 'onFocus':
        case 'onBlur':
        case 'onNativeFocus':
        case 'onNativeBlur':
            break;
        default:
            childProps[key] = props[key];
        }
    }

    return childProps;
}

function manual2(props) {
    var childProps = {
        ref: 1,
        onFocus: 2,
        onBlur: 3,
    };

    let keys = Object.keys(props);
    for (let i = 0; i < keys.length; i++) {
        let key = keys[i];
        switch (key) {
        case 'innerRef':
        case 'hasFocusPriority':
        case 'ref': // I do not know if this one could happen
        case 'onFocus':
        case 'onBlur':
        case 'onNativeFocus':
        case 'onNativeBlur':
            break;
        default:
            childProps[key] = props[key];
        }
    }

    return childProps;
}

Tests:

A
destructureAlt(a); destructureAlt(b); destructureAlt(c);
B
manual(a); manual(b); manual(c);
C
manual2(a); manual2(b); manual2(c);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
A
B
C

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.

**Benchmark Explanation**

The provided JSON represents a set of JavaScript microbenchmarks created using the MeasureThat.net platform. The benchmarks aim to compare the performance of different approaches for destructuring objects in JavaScript.

**Destructuring Approaches**

There are three test cases: `destructureAlt`, `manual`, and `manual2`. Each approach is designed to extract specific properties from an object, excluding certain keys (or properties) that are intentionally introduced to simulate real-world scenarios.

1. **`destructureAlt`**: This approach uses the `_altGenerated` function, which iterates over the source object's properties and assigns values to a target object only if the property name is not excluded by the `excluded` array.
2. **`manual`**: In this approach, a manual loop is used to iterate over the source object's properties and assign values to a child object (`childProps`) only if the property name matches a predefined set of exclusions.
3. **`manual2`**: Similar to `manual`, but uses an array of keys from the source object to skip certain exclusions.

**Library**

None, as this is a custom implementation without any external library dependencies.

**Special JavaScript Features/Syntax**

The `_altGenerated` function utilizes a technique called "key iteration" (also known as " key lookup"), which allows for efficient property lookups in an array. However, no other special features or syntax are present in this benchmark.

**Pros and Cons of Each Approach**

1. **`destructureAlt`**:
	* Pros: Efficient use of `excluded` array, easy to maintain and extend.
	* Cons: May have performance overhead due to function calls.
2. **`manual`**:
	* Pros: Simple, straightforward implementation; no additional dependencies required.
	* Cons: Manual loop can lead to potential errors if not implemented correctly; may be slower than `_altGenerated`.
3. **`manual2`**:
	* Pros: Similar to `manual`, but uses an array for exclusions, which might improve performance.
	* Cons: Still relies on manual looping, which could introduce errors.

**Benchmark Results**

The latest benchmark results show that the order of execution and device platform have a significant impact on performance. Firefox Mobile 48 appears to be the fastest browser for all three test cases, followed by other mobile browsers and desktop versions (not shown in this example).

In summary, `destructureAlt` seems to be the most efficient approach, but the manual approaches (`manual` and `manual2`) may still have a place in certain use cases where simplicity and control are more important than raw performance.

Related benchmarks:

Destructuring test! (version: 0)

Comparing performance of: A vs B vs C

Created: 6 years ago by: Guest

Jump to the latest result

A

B

C

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