Benchmark: Caching length property vs getting it each time in the loop

Script Preparation code:

var arr = [];
var count = 1000;
for(var i = 0; i<count; i++)
{
  arr.push(i);
}

Tests:

Cache length
var arrLen = arr.length; var sum = 0; for (var i = 0; i < arrLen; i++){ sum = arr[i]; }
Do not cache
var sum = 0; for (var i = 0; i < arr.length; i++){ sum = arr[i]; }

Historical Performance Data aggregated from 282 community runs

Desktop Results:

Chrome 82 runs

Cache length

31K/s

Do not cache

16K/s

Fastest: Cache length (2.0x faster)

View exact numbers

✓ Cache length: 30,813 ops/sec
• Do not cache: 15,520 ops/sec

Firefox 36 runs

Do not cache

1.4M/s

Cache length

1.4M/s

View exact numbers

✓ Do not cache: 1,444,300 ops/sec
• Cache length: 1,432,881 ops/sec

Mobile Results:

Safari 154 runs

123456

123K/s

Cache length

16K/s

Do not cache

8K/s

Fastest: 123456 (15.3x faster)

View exact numbers

✓ 123456: 123,456 ops/sec
• Cache length: 15,873 ops/sec
• Do not cache: 8,073 ops/sec

Chrome 10 runs

Cache length

15K/s

Do not cache

7K/s

Fastest: Cache length (2.0x faster)

View exact numbers

✓ Cache length: 14,505 ops/sec
• Do not cache: 7,295 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Cache length
Do not cache

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one month ago)

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

Browser/OS: Firefox 152 on Windows

View result in a separate tab

Cache length

3.8M/s

Do not cache

2.6M/s

View exact numbers

Test name	Executions per second
✓ Cache length	3,782,540 Ops/sec
Do not cache	2,553,183 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 explanation of the provided JSON benchmark definition and test cases.

**Benchmark Definition**

The provided JSON represents a JavaScript microbenchmark that compares two approaches for accessing an array length property: caching it in a variable versus getting it directly within the loop.

In summary, the benchmark defines two test cases:

1. "Cache length" ( Benchmark Definition ): This test case caches the length of the array in a variable (`var arrLen = arr.length;`) and then uses this cached value to iterate over the array.
2. "Do not cache" ( Benchmark Definition ): This test case does not cache the array length property and instead gets it directly within the loop (`for (var i = 0; i < arr.length; i++){ ... }`).

**Options Comparison**

The two approaches have different pros and cons:

**Caching (Cache length)**

Pros:

* Reduced overhead of getting the array length property multiple times
* Potential performance gain due to reduced number of property lookups

Cons:

* Additional memory allocation for storing the cached value
* Possible cache thrashing if the array size changes frequently

**Not Caching (Do not cache)**

Pros:

* No additional memory allocation required
* Simpler code with fewer variables

Cons:

* Increased overhead due to repeated property lookups
* Potential performance penalty due to increased number of property accesses

**Library/Function Considerations**

There is no explicit library or function mentioned in the benchmark definition. However, it's worth noting that some JavaScript environments (e.g., V8) might optimize array length properties using a technique called "inlining" or "register allocation," which can affect the performance characteristics of these test cases.

**Special JS Features/Syntax**

There are no special JavaScript features or syntax mentioned in this benchmark definition. The code only uses standard JavaScript syntax and conventions.

**Alternative Approaches**

Other alternative approaches to compare might include:

* Using `Array.prototype.length` instead of `arr.length`
* Using a different data structure (e.g., sparse arrays) that affects array length property behavior
* Implementing custom array length caching mechanisms using techniques like memoization or caching libraries
* Measuring performance with different JavaScript engines, browsers, or Node.js versions

Keep in mind that the choice of approach depends on the specific use case and requirements. The benchmark definition provided is a simple comparison of two approaches, but there are many other factors to consider when optimizing array length property access.

Caching length property vs getting it each time in the loop (version: 1)

save length of the array in the variable vs get it the loop

Comparing performance of: `Cache length vs Do not cache`

Created: 9 years ago by: Registered User

Go to the latest result

Cache length

Do not cache

Historical Performance Data aggregated from 282 community runs

Desktop Results:

Chrome 82 runs

Firefox 36 runs

Mobile Results:

Safari 154 runs

Chrome 10 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Caching length property vs getting it each time in the loop (version: 1)

save length of the array in the variable vs get it the loop

Comparing performance of: Cache length vs Do not cache

Created: 9 years ago by: Registered User

Go to the latest result

Cache length

Do not cache

Historical Performance Data aggregated from 282 community runs

Desktop Results:

Chrome 82 runs

Firefox 36 runs

Mobile Results:

Safari 154 runs

Chrome 10 runs

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: `Cache length vs Do not cache`