Benchmark: array find vs _.find

HTML Preparation code:

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.core.js"></script>

Tests:

array find
var a = ['hello', 'a', 'bc']; var b = a.find(item => item === 'bc');
_.find
var a = ['hello', 'a', 'bc']; var b = _.find(a, item => item === 'bc');

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

array find

106.1M/s

_.find

8.2M/s

Fastest: array find (12.9x faster)

View exact numbers

✓ array find: 106,123,992 ops/sec
• _.find: 8,234,248 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array find
_.find

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Safari/537.36

Browser/OS: Chrome 133 on Linux

View result in a separate tab

array find

73.1M/s

_.find

21.4M/s

View exact numbers

Test name	Executions per second
✓ array find	73,097,848 Ops/sec
_.find	21,406,964 Ops/sec

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 its test cases.

**Benchmark Definition**

The benchmark compares two approaches to achieve the same goal:

1. The traditional ES6 spread operator (`...`) used with the `Array.prototype.find()` method.
2. The older approach using the `concat()` method in combination with the `Array.prototype.includes()` method.

**Options Compared**

* **ES6 Spread Operator (new syntax)**: uses the new spread operator to create a copy of the array, and then calls `find()` on that copy.
	+ Pros:
		- More concise and readable
		- Often faster due to less overhead from creating an intermediate array
	+ Cons:
		- Not all browsers support the spread operator (Chrome 127 is one such browser)
		- May not be as efficient for very large arrays, since it creates a copy of the entire array
* **`concat()` method with `includes()`**: uses the `concat()` method to create a new array and then calls `includes()` on that array to find the element.
	+ Pros:
		- More widely supported across browsers, including older ones like Chrome 127
		- May be more efficient for very large arrays since it only creates an intermediate array without copying the entire original array
	+ Cons:
		- Less concise and less readable than the spread operator approach

**Library Used**

* `lodash`: a popular JavaScript utility library that provides functions like `find()`, which is used in one of the test cases.

**Special JS Feature/Syntax**

None mentioned in this benchmark. However, it's worth noting that the spread operator was introduced in ES6 and has become a standard feature in modern JavaScript.

**Other Alternatives**

There are other ways to achieve the same goal without using `concat()` or the spread operator:

* Using `Array.prototype.indexOf()`: finds the index of the element in the array.
* Using a custom loop: iterates over the array manually using an index variable.
* Using `Array.prototype.includes()`: checks if the element is present in the array, but returns the entire array as an argument.

However, these alternatives are less concise and may not be as efficient as the two options being compared in this benchmark.

**Benchmark Preparation Code**

The preparation code includes a script tag that loads the `lodash` library, which is used in one of the test cases.

I hope this explanation helps you understand what's being tested in this benchmark!

array find vs _.find (version: 0) Benchmark.js

Compare the new ES6 spread operator with the traditional concat() method

Comparing performance of: `array find vs _.find`

Created: 8 years ago by: Registered User

Go to the latest result

array find

_.find

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

array find vs _.find (version: 0) Benchmark.js

Compare the new ES6 spread operator with the traditional concat() method

Comparing performance of: array find vs _.find

Created: 8 years ago by: Registered User

Go to the latest result

array find

_.find

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `array find vs _.find`