Run results for: JavaScript reduce assign vs spread vs forEach baseline

Run details:

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

Browser: Chrome 94

Operating system: Windows

Device Platform: Desktop

Date tested: 3 years ago

Test name	Executions per second
Object Assign	5622962.5 Ops/sec
Object Spread	1492232.8 Ops/sec
Object Assign Library	312941.9 Ops/sec
forEach comparison	5581600.0 Ops/sec

Tests:

Object Assign
const data = [{id: 1, category: "frontend", title: "All About That Sass"}, {id: 2, category: "backend", title: "Beam me up, Scotty: Apache Beam tips"}, {id: 3, category: "frontend", title: "Sanitizing HTML: Going antibactirial on XSS attacks"}, {id: 4, category: "frontend", title: "Doing something Odd"}, {id: 5, category: "frontend", title: "How to rebuild the moon?"}]; const reduced = data.reduce((acc, item) => { acc[item.id] = item; return acc; }, {});
Object Spread
const data = [{id: 1, category: "frontend", title: "All About That Sass"}, {id: 2, category: "backend", title: "Beam me up, Scotty: Apache Beam tips"}, {id: 3, category: "frontend", title: "Sanitizing HTML: Going antibactirial on XSS attacks"}, {id: 4, category: "frontend", title: "Doing something Odd"}, {id: 5, category: "frontend", title: "How to rebuild the moon?"}]; const reduced = data.reduce((acc, item) => ({ ...acc, [item.id]: item }), {});
Object Assign Library
const data = [{id: 1, category: "frontend", title: "All About That Sass"}, {id: 2, category: "backend", title: "Beam me up, Scotty: Apache Beam tips"}, {id: 3, category: "frontend", title: "Sanitizing HTML: Going antibactirial on XSS attacks"}, {id: 4, category: "frontend", title: "Doing something Odd"}, {id: 5, category: "frontend", title: "How to rebuild the moon?"}]; const reduced = data.reduce((acc, item) => Object.assign(acc, {[item.id]: item}), {});
forEach comparison
const data = [{id: 1, category: "frontend", title: "All About That Sass"}, {id: 2, category: "backend", title: "Beam me up, Scotty: Apache Beam tips"}, {id: 3, category: "frontend", title: "Sanitizing HTML: Going antibactirial on XSS attacks"}, {id: 4, category: "frontend", title: "Doing something Odd"}, {id: 5, category: "frontend", title: "How to rebuild the moon?"}]; const reduced = {}; data.forEach((item) => { reduced[item.id] = item });

Run results for: JavaScript reduce assign vs spread vs forEach baseline

Object Assign

Object Spread

Object Assign Library

forEach comparison