MeasureThat.net

Run results for: Spread operator vs. Array.map and lodash.set

A comparison of the performance of the spread operator, [ ...array ], vs. Array.map(i => ...) and

Go to the benchmark
Run details:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_3) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0.5 Safari/605.1.15
Safari 13
Mac OS X 10.15.3
Desktop
5 years ago
Test name Executions per second
Spread operator 11138.1 Ops/sec
Spread operator v2 11335.7 Ops/sec
HTML Preparation code:
​x
 
1
​
2
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
Script Preparation code:
 
permutations = new Array(10000).map(() => ({ pagination: 'blah blah blah' }));
function updatePagination(action, prev) {
  return action;
}
action = 'something else';
state = { data: { permutations: [] } };
index = 5;
Tests:

  • Spread operator

     
    const updated = Object.assign([...permutations], {
      [index]: Object.assign({}, permutations[index], { 
        pagination: updatePagination(action, permutations[index]) 
      })
    })
    ​
    return { ...state, data: { ...state.data, permutations: updated } };

  • Spread operator v2

     
    const updated = Object.assign([...permutations], {
      [index]: { ...permutations[index], pagination: updatePagination(action, permutations[index]) }
    })
    ​
    return { ...state, data: { ...state.data, permutations: updated } };