Benchmark: Testing loops and find

Script Preparation code:

window.arr = new Array(100000).fill().map((x, i) => Math.random()*100000);
window.target = arr[50000];

Tests:

for loop
for(i=0; i<window.arr.length; i++){ var value = arr[i]; if (value === window.target) { val = value; break; } }
for of
let val; for (var value of window.arr) { if (value === window.target) { val = value; break; } }
array find
let val = window.arr.find(val => val === window.target);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
for loop
for of
array find

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 12; M2101K6P) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/106.0.0.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 106 on Android

View result in a separate tab

Test name	Executions per second
for loop	14.0 Ops/sec
for of	39.9 Ops/sec
array find	37.3 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what's being tested in this benchmark.

**Benchmark Definition**

The benchmark is testing three different approaches to find an element in an array:

1. **For Loop**: A traditional `for` loop that iterates through the array and checks each element until it finds a match.
2. **For of Loop**: An improved version of the `for` loop, which uses the `for...of` syntax to iterate through the array and check each element.
3. **Array Find Method**: A method that uses the `find()` function to search for an element in the array.

**Options Compared**

The benchmark is comparing the performance of these three approaches:

* **For Loop**: The traditional loop that iterates through the array manually.
* **For of Loop**: An improved version of the loop that uses the `for...of` syntax, which provides a more concise and expressive way to iterate through arrays.
* **Array Find Method**: A method that uses the `find()` function, which is optimized for performance.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

* **For Loop**:
	+ Pros: Simple, easy to understand, and works well in older browsers.
	+ Cons: Can be slower due to the manual iteration process.
* **For of Loop**:
	+ Pros: More concise, easier to read, and optimized for performance.
	+ Cons: Requires modern JavaScript support (ECMAScript 2015+).
* **Array Find Method**:
	+ Pros: Optimized for performance, easy to use, and works well in modern browsers.
	+ Cons: May not work as expected if the array is large or complex.

**Library**

None of the benchmark tests explicitly require a library. However, it's worth noting that the `find()` method uses an internal iterator under the hood, which relies on the ECMAScript standard.

**Special JS Feature/Syntax**

The only special feature used in this benchmark is the `for...of` syntax (introduced in ECMAScript 2015). This syntax provides a more concise and expressive way to iterate through arrays.

**Other Alternatives**

There are other ways to search for an element in an array, such as:

* Using `indexOf()` or `lastIndexOf()`: These methods can be slower than the `find()` method but provide more control over the search process.
* Using a library like Lodash: This popular utility library provides a range of functions for working with arrays, including searching and filtering.

Overall, the benchmark is testing the performance of different approaches to finding an element in an array, highlighting the trade-offs between simplicity, conciseness, and performance.

Related benchmarks:

Testing loops and find (version: 0)

Comparing performance of: for loop vs for of vs array find

Created: 2 years ago by: Guest

Jump to the latest result

for loop

for of

array find

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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