Benchmark: Math.max(...) vs Array.reduce()

Script Preparation code:

items = Array.from({length: 100}, (_, i) => i * 3)

Tests:

using Math.max() with spread operators
Math.max(...items)
using Array.reduce()
items.reduce((a, b) => a > b ? a : b)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
using Math.max() with spread operators
using Array.reduce()

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

Browser/OS: Chrome 121 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
using Math.max() with spread operators	1690527.9 Ops/sec
using Array.reduce()	5568947.5 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

The provided JSON represents a benchmark test case that compares two approaches to find the maximum value in an array: using `Math.max()` with spread operators and using `Array.reduce()`. I'll break down what each part does, their pros and cons, and some additional considerations.

**Benchmark Definition**

The benchmark definition specifies the problem being solved: finding the maximum value in an array. The script preparation code generates an array of 100 elements, where each element is a multiple of 3 (i.e., `items = Array.from({length: 100}, (_, i) => i * 3)`).

**Script Preparation Code**

The script preparation code defines the input data for the benchmark test:
```javascript
items = Array.from({length: 100}, (_, i) => i * 3);
```
This creates an array `items` with 100 elements, where each element is a multiple of 3.

**Html Preparation Code**

There is no HTML preparation code provided, which means that the benchmark test only runs in the JavaScript engine and does not involve any external factors like page rendering or network interactions.

**Individual Test Cases**

The benchmark test consists of two individual test cases:

1. **"using Math.max() with spread operators"**
```javascript
Math.max(...items);
```
This test case uses the `Math.max()` function with spread operators to find the maximum value in the array.
2. **"using Array.reduce()"**
```javascript
items.reduce((a, b) => a > b ? a : b);
```
This test case uses the `Array.reduce()` method to find the maximum value in the array.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

* **Math.max() with spread operators:**
	+ Pros:
		- Shorter code
		- Fast execution (since it's a native function)
	+ Cons:
		- May be less readable due to its concise syntax
		- May not work as expected if `items` is empty or contains non-numeric values
* **Array.reduce():**
	+ Pros:
		- More explicit and readable code
		- Can handle edge cases like empty arrays more gracefully
	+ Cons:
		- Slower execution (since it involves a function call)
		- May have performance overhead due to the reduction operation

**Library: None**

There is no external library used in this benchmark test. The tests only rely on built-in JavaScript functions and standard libraries.

**Special JS Feature/Syntax: None**

There are no special JavaScript features or syntaxes being tested in this benchmark.

**Other Alternatives**

If you're interested in exploring alternative approaches, here are a few options:

1. **`Math.max()` with `Array.prototype.map()`:**
```javascript
items.reduce((a, b) => Math.max(a, b));
```
This approach uses the `map()` function to create an array of maximum values and then reduces it to a single value.

2. **Using `sort()` method:**
```javascript
items.sort((a, b) => a > b ? -1 : 1);
items[0];
```
This approach sorts the array in descending order and returns the first element (which is the maximum value).

3. **Using `heapify()` function from `heap`:**
```javascript
const heap = require('heap');
const heapMax = new Heap((a, b) => a > b);
items.forEach(heapMax.push);
heapMax.pop();
```
This approach uses a heap data structure to efficiently find the maximum value in the array.

Keep in mind that these alternative approaches may have different performance characteristics and trade-offs compared to the original `Math.max()` with spread operators and `Array.reduce()` methods.

Related benchmarks:

Math.max(...) vs Array.reduce() (version: 0)

Comparing performance of: using Math.max() with spread operators vs using Array.reduce()

Created: 2 years ago by: Registered User

Jump to the latest result

using Math.max() with spread operators

using Array.reduce()

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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