Benchmark: Reading array length inside vs outside for loop

Script Preparation code:

var arr = [];
var i = 0;

while (i <= 1E5) arr[i] = i++;

Tests:

reading length outside the for loop
const length = arr.length for(var i = 0; i < length; i++) {}
reading length inside the for loop
for(var i = 0; i < arr.length; i++) {}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
reading length outside the for loop
reading length inside the for loop

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/120.0.0.0 Safari/537.36

Browser/OS: Chrome 120 on Mac OS X 10.15.7

View result in a separate tab

reading length outside the for loop

34K/s

reading length inside the for loop

362/s

View exact numbers

Test name	Executions per second
✓ reading length outside the for loop	34,463 Ops/sec
reading length inside the for loop	362 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what is being tested, compared, and other considerations.

**Benchmark Definition**

The benchmark definition is a JSON object that describes a simple JavaScript microbenchmark. It consists of:

* `Name`: A unique name for the benchmark.
* `Description`: An optional description of the benchmark (in this case, null).
* `Script Preparation Code`: The code that needs to be executed before running the benchmark. In this case, it creates an empty array (`arr`) and initializes a variable `i` to 0 using a while loop.
* `Html Preparation Code`: Optional HTML code that can be used for preparation (in this case, null).

**Individual Test Cases**

There are two test cases:

1. **Reading length outside the for loop**: The benchmark definition is `const length = arr.length; for(var i = 0; i < length; i++) {}`. This test case measures how fast a browser can execute a loop that accesses an array's length using the `arr.length` property, but only after declaring the variable `length`.
2. **Reading length inside the for loop**: The benchmark definition is `for(var i = 0; i < arr.length; i++) {}`. This test case measures how fast a browser can execute a loop that accesses an array's length directly within the loop itself.

**Comparison**

The comparison being tested is between accessing an array's length using two different approaches:

1. **Outside the for loop**: `const length = arr.length`
2. **Inside the for loop**: `for(var i = 0; i < arr.length; i++) {}`

This comparison aims to identify which approach is faster in a real-world scenario.

**Pros and Cons**

* **Accessing length outside the loop**:
	+ Pros: This approach can be more efficient because it avoids the overhead of accessing an array's length within the loop.
	+ Cons: It requires an extra variable declaration (`const length = arr.length;`) which may introduce additional memory allocation or lookup time.
* **Accessing length inside the loop**:
	+ Pros: This approach is simpler and eliminates the need for an extra variable declaration.
	+ Cons: It can be slower because it involves accessing the array's length multiple times within the loop, potentially leading to more overhead.

**Other Considerations**

* **Array Length Property**: In modern JavaScript engines, `arr.length` property is typically optimized to return a cached value. This means that accessing the length property may not incur significant additional overhead.
* **Loop Optimization**: Modern JavaScript engines often perform loop optimizations, such as inlining or hoisting, which can affect the performance of this benchmark.

**Library**

There is no specific library being used in this benchmark, but it relies on standard JavaScript features and syntax.

**Special JS Feature/ Syntax**

None mentioned.

**Alternative Approaches**

Other approaches to accessing an array's length could be:

* Using `Array.prototype.length` (which would add an additional property access)
* Using a computed property getter (e.g., `get length() { return arr.length; }`)
* Avoiding arrays altogether and using alternative data structures

However, these alternatives are not being tested in this benchmark.

Reading array length inside vs outside for loop (version: 0)

Comparing performance of: `reading length outside the for loop vs reading length inside the for loop`

Created: 5 years ago by: Guest

Go to the latest result

reading length outside the for loop

reading length inside the for loop

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Reading array length inside vs outside for loop (version: 0)

Comparing performance of: reading length outside the for loop vs reading length inside the for loop

Created: 5 years ago by: Guest

Go to the latest result

reading length outside the for loop

reading length inside the for loop

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `reading length outside the for loop vs reading length inside the for loop`