Benchmark: Lodash filter vs splice removing item from array

HTML Preparation code:

<script src="lodash.js"></script>

Script Preparation code:

var array = [...Array(100000).keys()];

Tests:

Array.prototype.splice
array.splice(55555,1)
Lodash filter
_.filter(array,n => n !== 55555)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.splice
Lodash filter

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/99.0.4844.84 Safari/537.36

Browser/OS: Chrome 99 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Array.prototype.splice	17883082.0 Ops/sec
Lodash filter	1979.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark and explain what's being tested, compared, and considered.

**Benchmark Definition and Script Preparation Code**

The benchmark measures the performance of two approaches: `Array.prototype.splice` and `_.filter` from Lodash library.

The script preparation code creates an array with 100,000 elements using the spread operator (`var array = [...Array(100000).keys()]`). This creates a large dataset for testing.

**Html Preparation Code**

The HTML preparation code includes a script tag that loads the Lodash library. This is necessary to use the `_.filter` function in the benchmark.

**Options Compared**

Two options are compared:

1. **Array.prototype.splice**: This method modifies the original array by removing an item at a specified index.
2. **_.filter**: This function returns a new array containing only the elements that pass a test (in this case, filtering out items equal to 55555).

**Pros and Cons of Each Approach**

**Array.prototype.splice**

Pros:

* Directly modifies the original array, reducing memory allocations.
* Can be more efficient for large datasets since it only needs to update the affected indices.

Cons:

* Modifies the original array, which might be undesirable in some scenarios.
* Can be slower than creating a new array if the array is very large and the index is far from the beginning or end.

**_.filter**

Pros:

* Returns a new array without modifying the original one, preserving its integrity.
* Can be faster for large datasets since it avoids updating indices.

Cons:

* Creates a new array, which can lead to increased memory usage.
* Might be slower due to the overhead of creating and copying the new array.

**Library: Lodash**

Lodash is a utility library that provides various functions for tasks like array manipulation, string manipulation, and more. In this case, `_.filter` is used to create a new array containing only the elements that satisfy the given condition (in this case, not equal to 55555).

**Special JS Feature or Syntax**

None mentioned in this benchmark.

**Other Considerations**

* The benchmark uses a fixed index (55555) for filtering, which might not be representative of real-world scenarios. In a typical use case, you'd likely want to filter based on multiple conditions.
* The script preparation code creates an array with 100,000 elements, which is a large dataset. This makes it easier to compare the performance of both approaches under load.
* The benchmark runs on Chrome 99 and Mac OS X 10.15.7, which might affect the results due to differences in browser or operating system implementations.

**Alternatives**

Other alternatives for filtering arrays could include:

* Using `Array.prototype.map` instead of `_.filter`, which would create a new array without modifying the original one.
* Implementing your own custom filtering function using vanilla JavaScript (without Lodash).
* Using other libraries like Underscore.js or Ramda.

Keep in mind that each alternative has its pros and cons, and the best approach depends on the specific use case and performance requirements.

Related benchmarks:

Lodash filter vs splice removing item from array (version: 0)

Comparing performance of: Array.prototype.splice vs Lodash filter

Created: 2 years ago by: Guest

Jump to the latest result

Array.prototype.splice

Lodash filter

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