Benchmark: Object arrays: findIndex vs forOf loop

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);
forOf loop
let output = -1 for (const [index, item] of arr.entries()) { if (item.id = foo) { output = index; break } }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
findIndex
forOf loop

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 break down the benchmark and explain what's being tested, compared, and the pros/cons of each approach.

**Benchmark Overview**

The benchmark is comparing two ways to find an element in an array:

1. Using `Array.prototype.findIndex()` (findIndex)
2. Using a `for...of` loop

**Options Compared**

* **findIndex**: A method that returns the index of the first element in the array that satisfies the provided callback function.
* **for...of loop**: A looping construct that iterates over an iterable object, allowing us to access each element's index and value.

**Pros and Cons of Each Approach**

**FindIndex:**

Pros:

* Concise and readable code
* Faster execution time (on average)
* Less prone to errors due to its robust implementation

Cons:

* May not work as expected if the array is very large or has a lot of gaps in the indices
* Can be slower than `for...of` loop for small arrays due to JavaScript's caching and optimization mechanisms

**For...of Loop:**

Pros:

* Provides more control over the iteration process
* Can be useful when working with non-array-like objects or custom iterables
* May be faster for very large arrays (due to the caching and optimization mentioned earlier)

Cons:

* More verbose code
* Prone to errors if not implemented correctly
* May not work as expected in older browsers or environments

**Library/Features Used**

In this benchmark, no specific libraries are used beyond the built-in `Array.prototype.findIndex()` method. However, it's worth noting that some JavaScript engines and versions may have different optimizations or implementation details for these methods.

**Special JS Features/Syntax**

The benchmark uses the following feature:

* **Arrow functions**: The callback function in the `findIndex` test case is an arrow function (`(itm) => itm.id === foo`). This feature allows for concise and readable code, while also avoiding the use of traditional function expressions.
* **Caching**: JavaScript engines like V8 (used by Chrome) are known to cache certain methods and operations to improve performance. The `for...of` loop may benefit from this caching due to its more explicit nature.

**Other Alternatives**

If you're looking for alternative approaches, consider the following:

* **Array.prototype.reduce()**: Instead of using a loop or `findIndex`, you can use the `reduce()` method to find the index of the element. This approach is often faster and more readable than traditional loops.
* **Using a custom iterator**: If you need more control over the iteration process, you can create a custom iterator using `Symbol.iterator` and implementing the `next()` method.

Keep in mind that these alternatives may have different performance characteristics or use cases, so it's essential to test and choose the best approach for your specific problem.

Related benchmarks:

Object arrays: findIndex vs forOf loop (version: 0)

Testing finding an object array via findIndex or by using a forOf loop

Comparing performance of: findIndex vs forOf loop

Created: 5 years ago by: Guest

Jump to the latest result

findIndex

forOf loop

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):