Run results for: Array spread vs concat vs others for adding an item and getting an immutable copy

Test name	Executions per second
✓ Create a copy using the spread operator	5,092,517 Ops/sec
Create a copy using array.concat	1,387,774 Ops/sec
Create a copy manually in a loop by index	121,043 Ops/sec
Create a copy manually in a loop using push	111,734 Ops/sec

Script Preparation code:

const array = [
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
  { foo: 'bar' },
];

Tests:

Create a copy using the spread operator
const newArray = [...array, { foo: 'bar' }];
Create a copy using array.concat
const newArray = array.concat({ foo: 'bar' });
Create a copy manually in a loop using push
const newArray = []; const len = array.length; for (let i = 0; i < len; i++) { newArray.push(array[i]); } newArray.push({ foo: 'bar' });
Create a copy manually in a loop by index
const len = array.length; const newArray = new Array(len + 1); for (let i = 0; i < len; i++) { newArray[i] = array[i]; } newArray[len] = { foo: 'bar' };

Run results for: Array spread vs concat vs others for adding an item and getting an immutable copy

Create a copy using the spread operator

Create a copy using array.concat

Create a copy manually in a loop using push

Create a copy manually in a loop by index