Benchmark: Loops and things

Script Preparation code:

var arr = new Array(15000);
arr.fill({ id: 0 });
arr = arr.map((el, idx) => el.id = idx);
var foo = Math.floor(Math.random() * 15000);

Tests:

findIndex
arr.findIndex((itm) => itm.id === foo);
for...of
for (const obj of arr) { if (obj.id === foo) break; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
findIndex
for...of

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

Test name	Executions per second
findIndex	1966.8 Ops/sec
for...of	2180.6 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to help explain the provided benchmark.

**What is being tested?**

The benchmark measures the performance of two different approaches to find an element in an array: `findIndex` and `for...of`. The test case creates an array of 15,000 elements with a unique `id` property, generates a random index `foo`, and then searches for the element with that `id` using both methods.

**Options compared**

The two options being compared are:

1. **findIndex**: This method returns the index of the first occurrence of the specified value in the array.
2. **for...of**: This loop constructs iterates over each element in the array and checks if its `id` property matches the target value.

**Pros and Cons**

* **findIndex**:
	+ Pros: Simple, efficient, and widely supported.
	+ Cons: May have performance overhead due to the need to search through the entire array.
* **for...of**:
	+ Pros: Can be more efficient for small arrays, as it avoids the overhead of a function call and indexing.
	+ Cons: Less intuitive and less widely supported than `findIndex`.

In general, `findIndex` is often preferred due to its simplicity and performance. However, in cases where the array is large or the search is performed infrequently, `for...of` may be a more suitable choice.

**Library usage**

There is no explicit library being used in this benchmark, as both options are built-in JavaScript methods.

**Special JS feature or syntax**

The benchmark uses `let const var`, which is a modern JavaScript syntax that specifies the scope and behavior of variables. Specifically:

* `var` is a function-scoped variable, which can lead to unexpected behavior.
* `let` is block-scoped, which means it is limited to the current scope.
* `const` is also block-scoped, but it cannot be reassigned once declared.

These syntaxes are widely supported in modern browsers and are considered good practice for new JavaScript code.

**Other alternatives**

Other approaches to finding an element in an array might include:

* **indexOf**: This method returns the index of the first occurrence of the specified value, similar to `findIndex`. However, it is deprecated in favor of `findIndex`.
* **Array.prototype.find()**: This method returns the first element that satisfies a given condition, using a callback function. While not directly related to finding an exact match, this method can be used for more complex searches.
* **Manual indexing**: This approach involves manually iterating over the array and checking each element's value. However, it is generally slower and less efficient than using built-in methods like `findIndex`.

Keep in mind that the choice of approach depends on specific requirements, performance constraints, and personal preference.

Related benchmarks:

Loops and things (version: 0)

Comparing performance of: findIndex vs for...of

Created: 2 years ago by: Guest

Jump to the latest result

findIndex

for...of

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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