Benchmark: JS map reduce inner array perf

HTML Preparation code:

<div id='min-data'></div>

Tests:

with map
const div = document.getElementById('min-data'); const newArray = []; for(let x = 0; x < 5;x++){ let product = {id: x, features:[]} for(let i = 0; i < 1000; i++){ const num = Math.floor(Math.random() * 1000); product.features.push({properties:{selected: num}}); } newArray.push(product)} let maxVal = newArray .map((p) => { return p.features .map((f) => { return f.properties.selected; }) .flat(); }) .flat() .reduce((a, b) => (a > b ? a : b), 0); div.innerHTML = maxVal.toString();
with reduce
const div = document.getElementById('min-data'); const newArray = []; for(let x = 0; x < 5;x++){ let product = {id: x, features:[]} for(let i = 0; i < 1000; i++){ const num = Math.floor(Math.random() * 1000); product.features.push({properties:{selected: num}}); } newArray.push(product)} let maxVal = newArray .map((p) => { return p.features.reduce((a, b) => a.properties.selected > b.properties.selected ? a : b ).properties.selected; }).reduce((a, b) => (a > b ? a : b), 0); div.innerHTML = maxVal.toString();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
with map
with reduce

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The provided JSON represents a JavaScript benchmark test on the MeasureThat.net website. The test measures the performance of two approaches: using `map` and `reduce` to find the maximum value in an array of objects.

**Options Compared**

Two options are compared:

1. **Using `map`**: This approach uses the `map()` method to transform each object in the array into a new array with only the selected property. Then, it uses the `flat()` method to flatten the arrays and finds the maximum value using the `reduce()` method.
2. **Using `reduce`**: This approach uses the `reduce()` method directly on the original array of objects. It iterates over each object in the array, compares the selected properties, and keeps track of the maximum value.

**Pros and Cons**

* **Using `map`**:
	+ Pros: Can be more intuitive for developers familiar with `map()`.
	+ Cons: Creates an intermediate array, which can lead to higher memory usage and slower performance for large datasets.
* **Using `reduce`**:
	+ Pros: Directly operates on the original array, reducing memory usage and potentially improving performance.
	+ Cons: Can be less intuitive for developers unfamiliar with `reduce()`.

**Library and Special JS Feature**

There is no library used in this benchmark. However, JavaScript features such as template literals (e.g., `const num = Math.floor(Math.random() * 1000);`) are utilized to generate random data.

**Other Considerations**

* **Array size**: The benchmark generates an array of 5 objects with 1000 properties each, which is a moderate-sized dataset.
* **Comparison**: The test compares the performance of these two approaches on a single machine, which may not accurately represent real-world scenarios where multiple machines are involved.

**Alternative Approaches**

Other possible approaches to find the maximum value in an array of objects could include:

1. **Using `forEach()` and a callback function**: Iterate over each object in the array using `forEach()`, compare the selected properties, and update a variable with the maximum value.
2. **Using a sorting algorithm**: Sort the array of objects by the selected property and return the first element, which will be the maximum value.
3. **Using a specialized library or framework**: Utilize a library or framework that provides optimized functions for finding maximum values in arrays.

Keep in mind that these alternative approaches may have varying performance characteristics and trade-offs compared to using `map` and `reduce`.

Related benchmarks:

JS map reduce inner array perf (version: 0)

Comparing performance of: with map vs with reduce

Created: 3 years ago by: Guest

Jump to the latest result

with map

with reduce

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):