Benchmark: Reduce array4 - MeasureThat.net

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

var arr = Array(10_000).fill(1)

Tests:

Reduce with empty erray
arr.reduce((acc, x) => { acc.push(x); return acc; }, []);
Reduce with filled array
arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array(arr.length));
Reduce with filled array with null
arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array(arr.length).fill(null));
Reduce with new Array
arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array());
Reduce with var
const a = new Array(arr.length); arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, a);
Reduce with var []
const a = []; arr.reduce((acc, x, index) => { acc.push(x) return acc; }, a);
Reduce with var [] assign by index
const a = []; arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, a);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Reduce with empty erray
Reduce with filled array
Reduce with filled array with null
Reduce with new Array
Reduce with var
Reduce with var []
Reduce with var [] assign by index

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 28 days ago)

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

Browser/OS: Chrome 130 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Reduce with empty erray	10601.3 Ops/sec
Reduce with filled array	5860.2 Ops/sec
Reduce with filled array with null	6316.3 Ops/sec
Reduce with new Array	5628.4 Ops/sec
Reduce with var	21483.9 Ops/sec
Reduce with var []	14137.6 Ops/sec
Reduce with var [] assign by index	3608.6 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 28 days ago):

LLMs can make mistakes. Check important info.

The benchmark titled "Reduce array4" evaluates the performance of JavaScript's `Array.prototype.reduce()` method across different implementations and initializations of the accumulator (the `acc` parameter). The objective is to compare how different styles of using the `reduce` method and initializing the accumulator array affect execution speed.

### Test Cases and Descriptions:

1. **Reduce with empty array**:
   ```javascript
   arr.reduce((acc, x) => { acc.push(x); return acc; }, []);
   ```
   - **Description**: This case initiates the `reduce` method with an empty array and pushes each element into it.
   - **Pros**: Simple and straightforward. 
   - **Cons**: Using `push` might be slightly less efficient than assigning values by index as it may involve dynamic resizing of the array.

2. **Reduce with filled array**:
   ```javascript
   arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array(arr.length));
   ```
   - **Description**: This case initializes `acc` with a new array of the same length as `arr`, assigning elements by index.
   - **Pros**: Safer on memory, as the size is predefined, potentially improving access time.
   - **Cons**: Requires extra memory allocation initially.

3. **Reduce with filled array with null**:
   ```javascript
   arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array(arr.length).fill(null));
   ```
   - **Description**: Similar to the previous, but the newly created array is filled with `null`.
   - **Pros**: May allow for enhanced performance if null values are beneficial in the context of certain modifications.
   - **Cons**: The presence of `null` doesn't add inherent advantages unless they are utilized later in some way.

4. **Reduce with new Array**:
   ```javascript
   arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, new Array());
   ```
   - **Description**: Starts with an empty new array but attempts to assign values by index.
   - **Pros**: The assignment to index makes it direct.
   - **Cons**: Initially empty, thus similar to the first test in terms of performance risks involved with resizing.

5. **Reduce with var**:
   ```javascript
   const a = new Array(arr.length);
   arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, a);
   ```
   - **Description**: Initializes the accumulator with an array of the specific length beforehand.
   - **Pros**: Efficient and memory-oriented, given a clear size and contiguous memory allocation.
   - **Cons**: Less flexibility as it assumes a specific size requirement.

6. **Reduce with var []**:
   ```javascript
   const a = [];
   arr.reduce((acc, x, index) => { acc.push(x); return acc; }, a);
   ```
   - **Description**: Uses an empty array but pushes values onto it as the `reduce` progresses.
   - **Pros**: Simple implementation.
   - **Cons**: Potentially less efficient due to array resizing.

7. **Reduce with var [] assign by index**:
   ```javascript
   const a = [];
   arr.reduce((acc, x, index) => { acc[index] = x; return acc; }, a);
   ```
   - **Description**: Uses an empty array and assigns values by index instead of pushing.
   - **Pros**: These assignments can be faster as they avoid the `push` method’s overhead.
   - **Cons**: For an empty array, this could end up creating sparse arrays, possibly impacting performance.

### Results Overview:

The results, measured as `ExecutionsPerSecond`, demonstrate performance variations among the different implementations:

- **Top Performer**: "Reduce with var" shows the highest execution speed, likely due to its efficient initialization and index-based assignment.
- **Lowest Performer**: "Reduce with var [] assign by index" had the lowest score, likely due to the inefficient handling of sparse arrays.

### Alternative Approaches:

1. **Map Method**: For simply transforming an array, `map` could be considered if the order of processing isn't essential, though it won’t directly reduce the array.
2. **For Loop**: A traditional `for` loop may provide a performance benefit in some scenarios, especially if optimized for specific data types or structures.
3. **ForEach Method**: Utilizes a more functional approach but does not return a value directly, requiring external mechanisms for accumulation.
4. **Other Libraries**: Libraries like Lodash provide utility functions that can abstract these operations optimally, although they may introduce additional overhead from the library itself.

In summary, the benchmark provides insights into various methodologies for using the reduce function in JavaScript, highlighting practical considerations for performance that software engineers should weigh based on the specific requirements of their applications.

Related benchmarks:

Reduce array4 (version: 1)

Comparing performance of: Reduce with empty erray vs Reduce with filled array vs Reduce with filled array with null vs Reduce with new Array vs Reduce with var vs Reduce with var [] vs Reduce with var [] assign by index

Created: 28 days ago by: Guest

Jump to the latest result

Reduce with empty erray

Reduce with filled array

Reduce with filled array with null

Reduce with new Array

Reduce with var

Reduce with var []

Reduce with var [] assign by index

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 28 days ago):