Benchmark: findUnion nested Array.includes vs Map.has

Script Preparation code:

var empty = { id: '', number: 10000 };
var array1 = [empty];
var array2 = [empty];
var entities = { '': empty };
var id = '';

for (let i = 0; i < 10000; i++) {
  id = String(i);
  entities[id] = { id, number: i }
}

function getRandomInt(min, max) {
  min = Math.ceil(min);
  max = Math.floor(max);
  return Math.floor(Math.random() * (max - min) + min); //The maximum is exclusive and the minimum is inclusive
}

for (let i = 0; i < 100; i++) {
  array1.push(entities[getRandomInt(i, 10000)]);
}

for (let i = 0; i < 100; i++) {
  array2.push(entities[getRandomInt(i, 10000)]);
}

​x
 
var empty = { id: '', number: 10000 };var array1 = [empty];var array2 = [empty];var entities = { '': empty };var id = '';​for (let i = 0; i < 10000; i++) {  id = String(i);  entities[id] = { id, number: i }}​function getRandomInt(min, max) {  min = Math.ceil(min);  max = Math.floor(max);  return Math.floor(Math.random() * (max - min) + min); //The maximum is exclusive and the minimum is inclusive}​for (let i = 0; i < 100; i++) {  array1.push(entities[getRandomInt(i, 10000)]);}​for (let i = 0; i < 100; i++) {  array2.push(entities[getRandomInt(i, 10000)]);}

Tests:

Array.includes

var data = Array.from(new Set([...array1, ...array2])).reduce(
  (acc, item) => {
    if (array1.includes(item)) {
      if (array2.includes(item)) {
        acc.union.push(item);
      } else {
        acc.lhsOnly.push(item);
      }
    } else {
      acc.rhsOnly.push(item);
    }

    return acc;
  },
  { rhsOnly: [], lhsOnly: [], union: [] }
);

console.log(data)

 
var data = Array.from(new Set([...array1, ...array2])).reduce(  (acc, item) => {    if (array1.includes(item)) {      if (array2.includes(item)) {        acc.union.push(item);      } else {        acc.lhsOnly.push(item);      }    } else {      acc.rhsOnly.push(item);    }​    return acc;  },  { rhsOnly: [], lhsOnly: [], union: [] });​console.log(data)

Map.has

var lMap = new Map(array1.map((item) => [item, true]));
var rMap = new Map(array2.map((item) => [item, true]));
var unionMap = new Map([...lMap.entries(), ...rMap.entries()]);

var result = { rhsOnly: [], lhsOnly: [], union: [] };

for (var [item] of unionMap) {
  if (lMap.has(item)) {
    if (rMap.has(item)) {
      result.union.push(item);
    } else {
      result.lhsOnly.push(item);
    }
  } else {
    result.rhsOnly.push(item);
  }
}

console.log(result)

 
var lMap = new Map(array1.map((item) => [item, true]));var rMap = new Map(array2.map((item) => [item, true]));var unionMap = new Map([...lMap.entries(), ...rMap.entries()]);​var result = { rhsOnly: [], lhsOnly: [], union: [] };​for (var [item] of unionMap) {  if (lMap.has(item)) {    if (rMap.has(item)) {      result.union.push(item);    } else {      result.lhsOnly.push(item);    }  } else {    result.rhsOnly.push(item);  }}​console.log(result)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Experimental features:

Memory measurements supported only in Chrome.
For precise memory measurements Chrome must be launched with --enable-precise-memory-info flag.
More information: Monitoring JavaScript Memory

Test case name	Result
Array.includes
Map.has

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 98 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Array.includes	16672.3 Ops/sec
Map.has	21708.9 Ops/sec

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

The provided JSON represents two JavaScript microbenchmarks, each testing the performance of different approaches for finding the union of arrays with duplicates. Here's an explanation of what is being tested and the pros and cons of each approach:

Benchmark Definition

The benchmark definition involves creating large arrays array1 and array2, each containing 10,000 elements with unique IDs. A map entities is created to store these elements with their corresponding IDs.

Two test cases are defined:

Array.includes: This test case uses the includes() method to check if an element exists in an array.
Map.has: This test case uses the has() method of a Map object to check if a key (element) exists in the map.

Approaches Compared

The two approaches compared are:

Array.includes: This approach iterates over the first array and checks for each element if it exists in both arrays using the includes() method.
Map.has: This approach creates two Maps, one for each array, and then merges them into a single Map. It then iterates over this merged Map to find the elements that exist in both arrays.

Pros and Cons of Each Approach

Array.includes:
- Pros: Simple and straightforward, easy to understand.
- Cons: May be slower for large datasets due to the overhead of iterating over the array and checking each element.
Map.has:
- Pros: Can be faster for large datasets because it uses a hash table data structure, which provides efficient lookup times.
- Cons: Requires creating multiple Maps, which can lead to increased memory usage.

Library Used

The Map object is used in the Map.has test case. The purpose of this library is to provide a data structure that stores key-value pairs in a way that allows for fast lookups and insertions.

Special JavaScript Feature or Syntax

There are no special JavaScript features or syntax used in these benchmarks, aside from the use of arrow functions (() => { ... }) and template literals (${...}).

Other Considerations

When evaluating the performance of these two approaches, it's essential to consider the following factors:

Memory usage: The Map.has approach may consume more memory due to the creation of multiple Maps.
Cache efficiency: The Array.includes approach may have better cache locality because it iterates over a single array and performs lookups in that array.

In general, the Map.has approach is expected to perform better for large datasets, while the Array.includes approach may be more suitable for smaller datasets or when memory usage needs to be minimized.

LLMs can make mistakes. Check important info.

**Benchmark Definition**

The benchmark definition involves creating large arrays `array1` and `array2`, each containing 10,000 elements with unique IDs. A map `entities` is created to store these elements with their corresponding IDs.

Two test cases are defined:

1. **Array.includes**: This test case uses the `includes()` method to check if an element exists in an array.
2. **Map.has**: This test case uses the `has()` method of a Map object to check if a key (element) exists in the map.

**Approaches Compared**

The two approaches compared are:

1. **Array.includes**: This approach iterates over the first array and checks for each element if it exists in both arrays using the `includes()` method.
2. **Map.has**: This approach creates two Maps, one for each array, and then merges them into a single Map. It then iterates over this merged Map to find the elements that exist in both arrays.

**Pros and Cons of Each Approach**

1. **Array.includes**:
	* Pros: Simple and straightforward, easy to understand.
	* Cons: May be slower for large datasets due to the overhead of iterating over the array and checking each element.
2. **Map.has**:
	* Pros: Can be faster for large datasets because it uses a hash table data structure, which provides efficient lookup times.
	* Cons: Requires creating multiple Maps, which can lead to increased memory usage.

**Library Used**

The `Map` object is used in the **Map.has** test case. The purpose of this library is to provide a data structure that stores key-value pairs in a way that allows for fast lookups and insertions.

**Special JavaScript Feature or Syntax**

There are no special JavaScript features or syntax used in these benchmarks, aside from the use of arrow functions (`() => { ... }`) and template literals (``${...}``).

**Other Considerations**

When evaluating the performance of these two approaches, it's essential to consider the following factors:

* Memory usage: The **Map.has** approach may consume more memory due to the creation of multiple Maps.
* Cache efficiency: The **Array.includes** approach may have better cache locality because it iterates over a single array and performs lookups in that array.

In general, the **Map.has** approach is expected to perform better for large datasets, while the **Array.includes** approach may be more suitable for smaller datasets or when memory usage needs to be minimized.

Related benchmarks:

findUnion nested Array.includes vs Map.has (version: 0)

Comparing performance of: Array.includes vs Map.has

Created: 3 years ago by: Guest

Jump to the latest result