Benchmark: React Spread Perf

HTML Preparation code:

<script crossorigin src="https://unpkg.com/react@18/umd/react.production.min.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.production.min.js"></script>
<div id="root"></div>

Script Preparation code:

function ComponentComboSpreading() {
    const rest = {
        test: '1',
        speed: '2',
        component: '3'
    };
    const onClick = React.useCallback(evt => evt.preventDefault(), []);
    const someText = "text";
    const someArray = ['1', '2', '3'];
    return React.createElement('button', {
        ...{
            ...rest,
            someArray,
            someText,
            onClick
        }
    }, 'Click me!');
}

function ComponentNotSpreading() {
    const rest = {
        test: '1',
        speed: '2',
        component: '3'
    };
    const onClick = React.useCallback(evt => evt.preventDefault(), []);
    const someText = "text";
    const someArray = ['1', '2', '3'];
    return React.createElement('button', {
        test: rest.test,
      	speed: rest.speed,
      	component: rest.component,
        someArray,
        someText,
        onClick
    }, 'Click me!');
}

Tests:

Spreading
ReactDOM.render(React.createElement(ComponentComboSpreading), document.getElementById('root'))
Not Spreading
ReactDOM.render(React.createElement(ComponentNotSpreading), document.getElementById('root'))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Spreading
Not Spreading

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!

Related benchmarks:

React Spread Perf (version: 0)

Comparing performance of: Spreading vs Not Spreading

Created: 3 years ago by: Guest

Jump to the latest result

Spreading

Not Spreading

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results