Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
.filter().map() vs flatMap() vs reduce()
Compare performance of `.filter().map()`, `flatMap()`, and `reduce()` in JavaScript
Go to the benchmark
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=608722" width="100%" height="500px"></iframe>
Run details:
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:138.0) Gecko/20100101 Firefox/138.0
Browser:
Firefox 138
Operating system:
Mac OS X 10.15
Device Platform:
Desktop
Date tested:
one year ago
regular for
8K/s
for ... of
4K/s
.reduce()
3K/s
regular for, prefilled then trimmed
2K/s
.filter().map()
2K/s
.flatMap()
1K/s
View exact numbers
Test name
Executions per second
✓
regular for
7,772 Ops/sec
for ... of
3,593 Ops/sec
.reduce()
3,193 Ops/sec
regular for, prefilled then trimmed
2,350 Ops/sec
.filter().map()
2,200 Ops/sec
.flatMap()
1,029 Ops/sec
HTML Preparation code:
<!--your preparation HTML code goes here-->
Script Preparation code:
const data = Array.from({length: 2**16}, (_, i) => ({index: i}));
Tests:
.filter().map()
const filteredData = data .filter(i => i.index % 2 === 0) .map(i => i.index);
.flatMap()
const filteredData = data.flatMap(i => i.index % 2 === 0 ? [i.index] : []);
.reduce()
const filteredData = data.reduce((memo, i) => { if (i.index % 2 === 0) { memo.push(i.index); } return memo; }, []);
for ... of
const filteredData = []; for (let i of data) { if (i.index % 2 === 0) { filteredData.push(i.index); } }
regular for
const filteredData = []; for (let i = 0; i < data.length; i++) { if (data[i].index % 2 === 0) { filteredData.push(data[i].index); } }
regular for, prefilled then trimmed
let filteredData = Array.from({length: data.length}); let filteredIndex = 0; for (let i = 0; i < data.length; i++) { if (data[i].index % 2 === 0) { filteredData[filteredIndex++] = data[i].index; } } filteredData = filteredData.splice(filteredIndex, data.length - filteredIndex);