Benchmark: merge array without duplicates - spread&new Set vs foreach&findIndex

Script Preparation code:

var arr = [];
var i = 0;
var copies = [1, 2, 4, 8, 16, 32, 64, 128, 256, 512, 1024, 2048, 4096, 8192]; // length 14
var result1 = [];
var result2 = [];

while (i <= 1E5) arr[i] = i++;

Tests:

forEach, findIndex, push
arr.forEach(item => { if(copies.findIndex(copy => copy === item) === -1){ result1.push(item); } });
spread, new Set
result2 = [...new Set([...arr,...copies])];

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
forEach, findIndex, push
spread, new Set

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 6.0; Nexus 5 Build/MRA58N) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4458.0 Mobile Safari/537.36

Browser/OS: Chrome Mobile 91 on Android 6.0

View result in a separate tab

Test name	Executions per second
forEach, findIndex, push	59.9 Ops/sec
spread, new Set	189.9 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 JSON and explain what's being tested in the benchmark.

**Overview**

The benchmark compares two approaches to merge an array without duplicates:

1. Using `Array.prototype.forEach()` with `Array.prototype.findIndex()` (test case 1: "forEach, findIndex, push")
2. Using the spread operator (`...`) and `Set` data structure (test case 2: "spread, new Set")

**Options Compared**

The two options being compared are:

* **Option 1:** Iterate over the array using `forEach()`, check if each element is a duplicate using `findIndex()` (which returns the index of the first occurrence of the element), and then push it to the result array.
	+ Pros: Simple and straightforward approach, easy to understand for developers familiar with `forEach()` and `findIndex()`.
	+ Cons: Can be slow due to the overhead of finding duplicates using `findIndex()` in each iteration.
* **Option 2:** Use the spread operator (`...`) to concatenate arrays, create a new `Set` from the combined array, and then convert it back to an array using the spread operator again.
	+ Pros: Efficient and fast approach for large datasets, as creating a set automatically removes duplicates. Additionally, this method leverages the optimized implementation of sets in modern browsers.
	+ Cons: May require additional library imports or syntax understanding, as it uses non-standard features like `Set`.

**Library**

The `Set` data structure is used in test case 2. A `Set` is a collection of unique values that can be added to it using the `add()` method and removed using the `delete()` method. The main purpose of this library is to automatically remove duplicates when adding elements.

**Special JavaScript Features or Syntax**

Neither option explicitly uses special features or syntax, but the spread operator (`...`) used in test case 2 is a modern JavaScript feature that has been widely adopted in browser engines and Node.js environments. However, older browsers might not support it out-of-the-box; this can be handled using polyfills.

**Alternatives**

Other approaches to merge an array without duplicates include:

* Using `Array.prototype.reduce()` with a callback function
* Creating a new object or map to store unique elements
* Sorting the array first and then removing duplicates
* Using a library like Lodash, which provides functions for merging arrays without duplicates

Keep in mind that these alternatives might have different performance characteristics compared to the two options being benchmarked.

**Additional Considerations**

When dealing with large datasets or performance-critical code, consider factors like:

* Data structure overhead: Are the used data structures (e.g., `Set`, `Array`) optimized for your use case?
* Algorithmic complexity: How does the algorithm's time and space complexity impact performance?
* Browser engine and Node.js support: Consider the versions of browsers and Node.js environments that need to be supported.

This analysis should provide a solid understanding of what's being tested in the benchmark, allowing software engineers to make informed decisions about which approach to use depending on their specific requirements.

Related benchmarks:

merge array without duplicates - spread&new Set vs foreach&findIndex (version: 0)

Measuring which is faster

Comparing performance of: forEach, findIndex, push vs spread, new Set

Created: 3 years ago by: Guest

Jump to the latest result

forEach, findIndex, push

spread, new Set

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