<script src="https://cdnjs.cloudflare.com/ajax/libs/nanoid/4.0.1/index.browser.js" integrity="sha512-YFaQHp+hWX9CMeIMngYK23kSIWaYlgsswmzmIdEw/HcK/5NLhXY2MbT0wQB5DnUzjW1uky4quIHtksukqZGkMw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
const SET_SIZE = 1000;
var set1 = new Set()
var set2 = new Set()
while (i < SET_SIZE) {
const nid = 'key:'+Math.random();
set1.add(nid);
if (i % 2 == 0) set2.add(nid);
i++;
}
while (i < SET_SIZE / 2) {
set2.add('key:'+Math.random());
}
const set3 = new Set([set1, set2]);
console.log(set3.size)
const set3 = new Set(set1);
set2.forEach(el => set3.add(el));
console.log(set3.size)
const set3 = new Set(function*() { yield* set1; yield* set2; }());
console.log(set3.size)
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Spreading | |
Set.forEach + Set.add | |
Generators |
Test name | Executions per second |
---|---|
Spreading | 15187.5 Ops/sec |
Set.forEach + Set.add | 13732.4 Ops/sec |
Generators | 9667.0 Ops/sec |
Let's break down the provided benchmark and explain what's being tested, compared, and analyzed.
Benchmark Overview
The benchmark is designed to compare different methods for unionizing JavaScript Sets. A Set in JavaScript is an unordered collection of unique values. The benchmark aims to determine which method is most efficient for combining two Sets.
Test Cases
There are three test cases:
...
) to create a new Set from the elements of set1
and set2
.const set3 = new Set([...set1, ...set2]);
console.log(set3.size);
Pros: Simple and concise. This method is widely supported across modern browsers.
Cons: May not be as efficient as other methods for very large Sets due to the creation of a new array.
set1
using forEach
and adds each element to set3
using add
.const set3 = new Set(set1);
set2.forEach(el => set3.add(el));
console.log(set3.size);
Pros: Can be more efficient for large Sets because it avoids creating a temporary array.
Cons: May have higher overhead due to the iteration and function calls.
set1
and set2
, which are then added to set3
.const set3 = new Set(function*() { yield* set1; yield* set2; }());
console.log(set3.size);
Pros: Can be more efficient for very large Sets because it avoids creating temporary arrays.
Cons: May have higher overhead due to the creation of a generator function and its associated computations.
Library Used
The benchmark uses the nanoid
library, which generates random IDs. However, this library is not explicitly used in the test cases; instead, it's used for the browser's identification string (RawUAString
) in the benchmark results.
Special JavaScript Features or Syntax
None of the methods use any special JavaScript features or syntax that would affect their performance.
Alternatives
Other alternatives for unionizing Sets include:
Set.prototype.union()
method (not supported in older browsers).lodash.set
or underscore.util.union
.Keep in mind that the choice of method depends on the specific use case, performance requirements, and compatibility considerations.