Benchmark: array iteration Large2

Script Preparation code:

var myArrayLarge = Array(10000);
for (let i=0; i<10000; i++) {
	myArrayLarge[i] = i; 
}

Tests:

for element of LARGE
for (ele of myArrayLarge) { let something = ele; }
for const element of LARGE
for (const ele of myArrayLarge) { let something = ele; }
myArr forEach LARGE
myArrayLarge.forEach(function(s) { let something = s; });
array index LARGE
for (let i=0; i<10000; i++) { let something = myArrayLarge[i]; }
map LARGE
myArrayLarge.map((i) => { let something = i; });
forEach ES6 LARGE
myArrayLarge.forEach(s => { let something = s; });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for element of LARGE
for const element of LARGE
myArr forEach LARGE
array index LARGE
map LARGE
forEach ES6 LARGE

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:61.0) Gecko/20100101 Firefox/61.0

Browser/OS: Firefox 61 on Windows 7

View result in a separate tab

Test name	Executions per second
for element of LARGE	3413.1 Ops/sec
for const element of LARGE	10649.6 Ops/sec
myArr forEach LARGE	69630.7 Ops/sec
array index LARGE	14982.5 Ops/sec
map LARGE	6294.0 Ops/sec
forEach ES6 LARGE	69906.4 Ops/sec

Autogenerated LLM Summary (model llama3.1:latest, generated 2 months ago):

LLMs can make mistakes. Check important info.

Let's break down the benchmark definition and results.

**Benchmark Definition**

The benchmark tests the performance of iterating over a large array (`myArrayLarge`) with different methods. The test cases are:

1. **For each element**: `for (let ele of myArrayLarge) { ... }`
2. **For const element**: `for (const ele of myArrayLarge) { ... }` (similar to 1, but with `const` instead of `let`)
3. **Array.prototype.forEach**: `myArrayLarge.forEach(function(s) { ... });`
4. **Index-based iteration**: `for (let i = 0; i < 10000; i++) { myArrayLarge[i]; }`
5. **Array.prototype.map**: `myArrayLarge.map((i) => { ... });` (note: this method returns a new array, so it's not strictly an iteration)
6. **ES6 forEach**: `myArrayLarge.forEach(s => { ... });`

**Library/Libraries**

There are no external libraries used in these test cases.

**JS Features/Syntax**

None of the test cases use any special or experimental JavaScript features or syntax beyond what is already available in modern browsers (e.g., ES5 and later).

**What's being compared**

The primary goal of this benchmark is to compare the performance of different iteration methods over a large array. The results show how each method performs on a specific browser, device platform, and operating system.

**Pros/Cons of each approach**

1. **For each element**: Simple and efficient, but may not be suitable for sparse arrays or arrays with holes.
2. **For const element**: Similar to the first option, but `const` ensures that the loop variable is not reassigned, which can improve performance in some cases.
3. **Array.prototype.forEach**: A standard method for iterating over an array, but it may have higher overhead compared to simple loops due to its function call and closure creation.
4. **Index-based iteration**: Can be efficient when using a simple `for` loop, but requires explicit index management, which can lead to errors if not done correctly.
5. **Array.prototype.map**: Creates a new array with the transformed values, so it's not strictly an iteration method. However, it can be useful for transformations that require new data.
6. **ES6 forEach**: Similar to `forEach` on Array.prototype, but with a more concise syntax.

**Other considerations**

When choosing an iteration method, consider factors such as:

* Performance: How important is execution speed?
* Memory usage: Does the method allocate extra memory or create temporary objects?
* Readability and maintainability: Which method is easiest to understand and modify?
* Array properties: Are you dealing with sparse arrays, sorted data, or specific array formats?

**Alternatives**

Other iteration methods not tested here include:

* `while` loops
* Iterators (e.g., `createIterator` on some browsers)
* Custom iteration functions using recursion or other techniques

Keep in mind that the best approach often depends on the specific use case and performance requirements.

Related benchmarks:

array iteration Large2 (version: 5)

Comparing performance of: for element of LARGE vs for const element of LARGE vs myArr forEach LARGE vs array index LARGE vs map LARGE vs forEach ES6 LARGE

Created: 6 years ago by: Registered User

Jump to the latest result

for element of LARGE

for const element of LARGE

myArr forEach LARGE

array index LARGE

map LARGE

forEach ES6 LARGE

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.1:latest, generated 2 months ago):