Benchmark: array object 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 = [{item:'hello'}, {item:'a'}, {item:'bc'}]; var b = a.find(item => item.item === 'bc');
_.find
var a = [{item:'hello'}, {item:'a'}, {item:'bc'}]; var b = _.find(a, item => item.item === 'bc');

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: 5 years ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36

Browser/OS: Chrome 71 on Mac OS X 10.14.2

View result in a separate tab

Test name	Executions per second
array find	41748360.0 Ops/sec
_.find	3809075.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what is being tested in this benchmark and compare the two approaches.

**Benchmark Context**

The benchmark compares the performance of two ways to find an element in an array:

1. Using the new ES6 spread operator (`...`), which returns a new array with the specified item.
2. Using the traditional `concat()` method, which concatenates a new array with the existing array.

**Options Compared**

* **Spread Operator (`...`)**: Returns a new array with the specified item.
	+ Pros:
		- More readable and expressive code
		- Less memory allocation, as it doesn't create a new array in the process
	+ Cons:
		- May be slower due to the creation of a new array
* **`concat()` Method**: Concatenates a new array with the existing array.
	+ Pros:
		- Faster and more efficient, as it only creates a new array reference
	+ Cons:
		- Less readable and expressive code

**Comparison**

In the benchmark, two test cases are used to compare the performance of these two approaches:

1. Using `find` with an arrow function (`item => item.item === 'bc'`)
2. Using `_`.find` from the Lodash library with a similar arrow function

The `_.find` approach is used as a control group, allowing us to isolate the performance impact of using the spread operator.

**Library**

In this benchmark, the Lodash library is used for the `_`.find` test case. Lodash provides various utility functions for working with arrays and objects, including `find`, which finds the first element in an array that satisfies a predicate function.

**Special JS Feature/Syntax**

The new ES6 spread operator (`...`) is used in the benchmark. This feature allows creating a new array by spreading elements from an existing array or object into a new array. In this case, it's used to create a new array with the specified item, which is then searched for.

**Alternatives**

Other alternatives to using the spread operator and `concat()` method include:

* Using `Array.prototype.indexOf()` or `Array.prototype.findIndex()`, which return the index of the first occurrence of the specified element.
* Using `Array.prototype.map()` with a callback function that returns a new array with the desired elements.

These alternatives may have different performance characteristics depending on the specific use case and requirements.

Related benchmarks:

array object find vs _.find (version: 0)

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

Comparing performance of: array find vs _.find

Created: 5 years ago by: Guest

Jump to the latest result

array find

_.find

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