Run results for: JavaScript, spread operator vs Object.assign vs property setter using array as source

Run details:

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36

Browser: Chrome 111

Operating system: Windows

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
Create new object using spread	689489.3 Ops/sec
Mutate target object with source object	1651044.0 Ops/sec
Mutate target object using setter and array as object source	10477460.0 Ops/sec

Tests:

Create new object using spread
const mainObject = { id1: { p1: 'id1.p1', p2: 'id1.p2', p3: { p3x1: 'id1.p3x1', p3x2: 'id1.p3x2' }, p4: [1, 2, 3, 4] }, id2: { p1: 'id2.p1', p2: 'id2.p2', p3: { p3x1: 'id2.p3x1', p3x2: 'id2.p3x2' }, p4: [1, 2, 3, 4] }, }; const objectToJoin = { id3: { p1: 'id3.p1', p2: 'id3.p2', p3: { p3x1: 'id3.p3x1', p3x2: 'id3.p3x2' }, p4: [1, 2, 3, 4] }, } const result = { ...mainObject, ...objectToJoin, };
Mutate target object with source object
const mainObject = { id1: { id: 'id1', p1: 'id1.p1', p2: 'id1.p2', p3: { p3x1: 'id1.p3x1', p3x2: 'id1.p3x2' }, p4: [1, 2, 3, 4] }, id2: { id: 'id2', p1: 'id2.p1', p2: 'id2.p2', p3: { p3x1: 'id2.p3x1', p3x2: 'id2.p3x2' }, p4: [1, 2, 3, 4] }, }; const objectToJoin = { id3: { id: 'id3', p1: 'id3.p1', p2: 'id3.p2', p3: { p3x1: 'id3.p3x1', p3x2: 'id3.p3x2' }, p4: [1, 2, 3, 4] }, } Object.assign(mainObject, objectToJoin);
Mutate target object using setter and array as object source
const mainObject = { id1: { id: 'id1', p1: 'id1.p1', p2: 'id1.p2', p3: { p3x1: 'id1.p3x1', p3x2: 'id1.p3x2' }, p4: [1, 2, 3, 4] }, id2: { id: 'id2', p1: 'id2.p1', p2: 'id2.p2', p3: { p3x1: 'id2.p3x1', p3x2: 'id2.p3x2' }, p4: [1, 2, 3, 4] }, }; const objectsToJoin = [{ id: 'id3', p1: 'id3.p1', p2: 'id3.p2', p3: { p3x1: 'id3.p3x1', p3x2: 'id3.p3x2' }, p4: [1, 2, 3, 4] }]; objectsToJoin.forEach((object) => { mainObject[object.id] = object; })