Benchmark: Computing the running sum of an array

Computing the running sum of an array (version: 2)

The main difference between these loops is that the second loop increments i mid-loop so it can avoid a subtraction to get the previous element. This is the kind of operation you would do to get an integral image so the array size is set to the same amount of pixels as a 720p image.

Comparing performance of: Normal way vs Mid-iteration increment (post) vs Mid-iteration increment (pre)

Created: 2 months ago by: Registered User

Jump to the latest result

HTML Preparation code:

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

Script Preparation code:

var array1 = new Uint16Array(1280 * 720);
for (let i = array1.length; i > 0; i--) {
	array1[i] = Math.round(Math.random() * 3);
}
var array2 = Uint16Array.from(array1);
var array3 = Uint16Array.from(array1);

Tests:

Normal way
const length = array1.length; for (let i = 1; i < length; i++) { array1[i] += array1[i - 1]; }
Mid-iteration increment (post)
const length = array2.length - 1; for (let i = 0; i < length;) { const last = array2[i++]; array2[i] += last; }
Mid-iteration increment (pre)
const length = array3.length - 1; for (let i = 0; i < length;) { const last = array3[i]; array3[++i] += last; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Normal way
Mid-iteration increment (post)
Mid-iteration increment (pre)

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:135.0) Gecko/20100101 Firefox/135.0

Browser/OS: Firefox 135 on Linux

View result in a separate tab

Test name	Executions per second
Normal way	463.9 Ops/sec
Mid-iteration increment (post)	472.5 Ops/sec
Mid-iteration increment (pre)	470.5 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON is focused on performance comparison between two different looping approaches used to accumulate values in an array. The context of this operation is often applied in image processing tasks, where cumulative sums, such as integral images, are required for operations like filtering and edge detection.

### Benchmark Options

1. **Normal Loop:**
   - **Definition:** This function iterates through the `array` starting from the second element and adds the value of the preceding element to the current element:  
     ```javascript
     for (let i = 1; i < length; i++) {
         array[i] += array[i - 1];
     }
     ```
   - **Pros:** 
     - Straightforward and easy to understand for someone reading the code.
     - Makes use of a direct indexing approach that is commonly used for similar operations.
   - **Cons:** 
     - Each iteration accesses the previous element's index, which implies a subtraction operation that may add slight overhead.

2. **Split Loop:**
   - **Definition:** This function modifies the loop structure by avoiding an explicit subtraction. The loop increments `i` within the loop's body for each two steps, which allows it to potentially skip some calculations:  
     ```javascript
     for (let i = 0; i < length;) {
         const last = array[i];
         array[++i] += last;
     }
     ```
   - **Pros:** 
     - By adjusting the loop control, it reduces the number of operations in certain scenarios. 
     - The reduced number of index accesses may lead to performance improvements depending on the JavaScript engine's optimizations.
   - **Cons:** 
     - It's less intuitive and slightly harder to read compared to the normal loop pattern. 
     - It may have cases where optimization does not lead to performance improvements, or it could potentially lead to subtle bugs if not implemented carefully.

### Performance Results
From the latest benchmark results, we can see the performance of each function in terms of executions per second:

- **Split Loop:** 472.47 executions per second 
- **Normal Loop:** 469.14 executions per second

The “Split Loop” approach performed slightly better in this test case. This might indicate that the optimization in the loop structure was effective in this particular execution context, as assessed using the Firefox 135 browser on Linux.

### Considerations
While these two methods may yield differences in performance, the actual results can vary significantly based on:

- The size of the input array (`Uint16Array` of 1280 * 720 in this case).
- The underlying JavaScript engine optimizations (V8 for Chrome, SpiderMonkey for Firefox, etc.).
- The hardware and environment in which the tests are executed. Performance can differ on desktops versus mobile devices.

### Alternatives
Aside from these looping methods, there are several other alternatives for achieving cumulative sums in an array:

1. **Array.prototype.reduce:** This functional approach may be simpler and leverages built-in JavaScript functions, but might be less performant compared to the manual looping constructs:
    ```javascript
    array.reduce((acc, val, index) => (array[index] += acc, array[index]), 0);
    ```

2. **Typed Arrays:** Utilizing typed arrays can sometimes provide performance benefits due to their fixed size and predictability in memory allocation.

3. **Web Workers:** For larger arrays or more complex calculations, employing Web Workers can allow for parallel processing, which might mitigate any performance bottlenecks from the main execution thread.

In summary, the benchmark compares the performance of two approaches to accumulate values in an array, highlighting their respective advantages and disadvantages. Different contexts may favor one approach over the other, and alternative methods such as functional programming practices or multithreading can also provide viable solutions for similar tasks.

Related benchmarks:

Computing the running sum of an array (version: 2)

The main difference between these loops is that the second loop increments i mid-loop so it can avoid a subtraction to get the previous element. This is the kind of operation you would do to get an integral image so the array size is set to the same amount of pixels as a 720p image.

Comparing performance of: Normal way vs Mid-iteration increment (post) vs Mid-iteration increment (pre)

Created: 2 months ago by: Registered User

Jump to the latest result

Normal way

Mid-iteration increment (post)

Mid-iteration increment (pre)

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):