Benchmark: for vs foreach vs for..in vs for..of - forkfork

Script Preparation code:

var array = new Array(100000);

Tests:

for
for (var i = 0; i < array.length; i++) { array[i]; }
foreach
array.forEach(function(i) { array[i]; });
for in
for (var i in array) { array[i]; }
for..of
for (var i of array) { array[i]; }
arr cached
var len = array.length; for (var i = 0; i < len; i++) { array[i]; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for
foreach
for in
for..of
arr cached

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks.

**What is being tested?**

The provided benchmark measures the performance of different loop constructs in JavaScript: `for`, `foreach`, and two variations of `for` (with `in` and without caching the array length).

**Options compared:**

1. **For**: The traditional, manual loop construct using `var i = 0; while(i < array.length) { array[i]; }`.
2. **Foreach**: The built-in array method that iterates over an array using a callback function.
3. **For...in**: A loop construct that iterates over the keys of an object, which can be used to iterate over arrays in some cases.
4. **For...of**: A newer loop construct that iterates directly over the elements of an array.

**Pros and Cons:**

* **For**: Manual control, no dependencies on built-in methods, but requires more code and is prone to off-by-one errors.
* **Foreach**: Easy to use, efficient, and doesn't require manual indexing. However, it relies on the browser's internal implementation of arrays, which might be different between browsers.
* **For...in**: Can be used to iterate over arrays, but it iterates over indices, not values. It also performs additional work (checking for own enumerable properties) that isn't necessary for array iteration.
* **For...of**: Modern and efficient, direct iteration over elements, and doesn't require manual indexing. However, it's a relatively new feature, and its behavior might vary between browsers.

**Library usage:**

None of the test cases use external libraries.

**Special JavaScript features or syntax:**

The `for...in` loop uses an older syntax that is still supported in modern JavaScript engines, but it's not as efficient or recommended for array iteration. The `foreach` method relies on the built-in `forEach` function of arrays, which might have different behavior between browsers.

**Benchmark preparation code:**
```javascript
var array = new Array(100000);
```
The benchmark creates an array with 100,000 elements and initializes it with no value.

**Individual test cases:**

Each test case defines a specific loop construct and its corresponding JavaScript code. The `for` loop uses manual indexing, the `foreach` loop uses the built-in `forEach` method, and the two variations of `for` (with `in` and without caching the array length) use different approaches to iterate over the array.

**Latest benchmark result:**

The results show the execution rate per second for each test case in Chrome 118 on a desktop platform. The fastest loop construct is `arr cached`, which likely exploits the browser's internal implementation of arrays.

Related benchmarks:

for vs foreach vs for..in vs for..of - forkfork (version: 0)

Compare loop performance

Comparing performance of: for vs foreach vs for in vs for..of vs arr cached

Created: 2 years ago by: Guest

Jump to the latest result

for

foreach

for in

for..of

arr cached

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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