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

Run details:

User agent: Mozilla/5.0 (Linux; Android 11; M2007J20CI) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Mobile Safari/537.36

Browser: Chrome Mobile 103

Operating system: Android

Device Platform: Mobile

Date tested: one year ago

Test name	Executions per second
reduce + Array.prototype.concat	98601.9 Ops/sec
Array.prototype.flatMap	115272.2 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