Benchmark: for i < length vs .forEach(t) vs for..of vs for t = keys[i] vs for i =0; i in keys vs for i in object vs .reduce (keys only)

Script Preparation code:

var object = {};
for (let i = 1; i <= 100000; i++) object[String(i)] = i;

Tests:

for..of
for (const k of Object.keys(object)) { window.k = k; }
for t = array[i]
for (let keys = Object.keys(object), i = -1, k; k = keys[++i];) { window.k = k; }
for i=0; i in array
for (let keys = Object.keys(object), i = -1; ++i in keys;) { window.k = keys[i]; }
for i in array,
for (const k in object) { window.k = k; }
.reduce
Object.keys(object).reduce((_, k) => { window.k = k; });

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for..of
for t = array[i]
for i=0; i in array
for i in array,
.reduce

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:94.0) Gecko/20100101 Firefox/94.0

Browser/OS: Firefox 94 on Mac OS X 10.15

View result in a separate tab

Test name	Executions per second
for..of	30.1 Ops/sec
for t = array[i]	28.2 Ops/sec
for i=0; i in array	28.8 Ops/sec
for i in array,	17.2 Ops/sec
.reduce	28.1 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of different JavaScript loop constructs is crucial for understanding the nuances of the language and optimizing code.

**Benchmark Overview**

The provided benchmark compares four common loop constructs:

1. `for..of` (using `Object.keys()` to iterate over an array)
2. `for i=0; i in array` (traditional `in` loop)
3. `for t = array[i]` (array indexing with `i`)
4. `.reduce()` (using the built-in `reduce()` method)

**Options Comparison**

Here's a brief description of each option, along with their pros and cons:

1. **`for..of`**: This loop construct uses the `Object.keys()` function to iterate over an array. It provides a concise way to iterate over an array and is often considered more readable.

Pros: Efficient, concise, and easy to read.
Cons: May not be as familiar to older developers or those without experience with modern JavaScript syntax.

2. **`for i=0; i in array```**: This traditional loop construct uses the `in` operator to iterate over an array. It's a common pattern but can lead to issues like incrementing `i` manually, which can be error-prone.

Pros: Well-established and widely supported.
Cons: May require manual index management and is less concise than modern alternatives.

3. **`for t = array[i]```**: This loop construct uses array indexing (`array[i]`) to access each element. It's similar to traditional loops but might not be as readable due to the use of variable indexing.

Pros: Efficient, but may require more setup and understanding.
Cons: Less readable than `for..of`, especially for those without experience with array indexing.

4. **`.reduce()`**: The `.reduce()` method is a built-in function that can reduce an array to a single value by applying a callback function to each element. It's not typically used as a loop construct, but it can be adapted for this purpose.

Pros: Efficient and concise.
Cons: Requires understanding of the `reduce()` method and its usage.

**Library Usage**

The benchmark uses the built-in JavaScript functions:

* `Object.keys()`: Returns an array of strings representing the enumerable properties of an object. It's used in two different ways (`for..of` and `.reduce()`).
* The `in` operator: Used in the traditional loop construct (`for i=0; i in array`) to access elements of an array.

**Special JavaScript Features or Syntax**

This benchmark doesn't use any special JavaScript features or syntax that would require additional explanation. It only utilizes standard JavaScript constructs and built-in functions.

**Other Alternatives**

Other alternatives for looping over arrays include:

* `forEach()`: A function call that executes a callback function once for each element in an array.
* `map()`, `filter()`, and other array methods: These can be used to transform or filter arrays, but they might not be the best choice for simple iteration.

In summary, this benchmark provides a fair comparison of four common loop constructs in JavaScript. Understanding the pros and cons of each option is crucial for writing efficient and readable code.

Related benchmarks:

for i < length vs .forEach(t) vs for..of vs for t = keys[i] vs for i =0; i in keys vs for i in object vs .reduce (keys only) (version: 5)

Compare loop performance

Comparing performance of: for..of vs for t = array[i] vs for i=0; i in array vs for i in array, vs .reduce

Created: 3 years ago by: Registered User

Jump to the latest result

for..of

for t = array[i]

for i=0; i in array

for i in array,

.reduce

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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