Run results for: reduce.concat() vs flatMap()

Run details:

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/117.0

Browser: Firefox 117

Operating system: Linux

Device Platform: Desktop

Date tested: 8 months ago

Test name	Executions per second
reduce + Array.prototype.concat	981303.4 Ops/sec
Array.prototype.flatMap	814896.8 Ops/sec

Script Preparation code:

var flag = {
	a: {'truthy': true, 'falsey': false, 'only-in-a': true},
	b: {'truthy': true, 'falsey': false, 'only-in-b': true},
	unused: {'truthy': true, 'falsey': false},
};
var rollNames = ['a', 'b', 'missing'];

Tests:

reduce + Array.prototype.concat
var other = rollNames.flatMap(rollName => // convert flag object to array containing the names of all fields with a truthy value Object.entries(flag[rollName] ?? {}).reduce((opts, [key, value]) => opts.concat(value ? key : []), []) ).reduce((unique, option) => { // ensure option entries are unique return unique.includes(option) ? unique : unique.concat(option); }, []);
Array.prototype.flatMap
var other = [...new Set(rollNames.flatMap(rollName => // convert flag object to array containing the names of all fields with a truthy value Object.entries(flag[rollName] ?? {}).flatMap(([key, value]) => value ? [key] : []) ))];

Run results for: reduce.concat() vs flatMap()

Compare the new ES6 spread operator with the traditional concat() method

reduce + Array.prototype.concat

Array.prototype.flatMap