Benchmark: merge data arr vs obj

HTML Preparation code:


<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

var arr1 = [];
var arr2 = [];
var obj1 = {};
var obj2 = {};

for (i = 0; i < 10000; i++) {
  var obj = {
     id: Math.random().toString(36).substr(2, 5),
     name: Math.random().toString(36).substr(2, 5)
  };
  obj1[obj.id] = obj;
  arr1.push(obj);
}

for (i = 10000; i < 20000; i++) {
  var obj = {
     id: Math.random().toString(36).substr(2, 5),
     name: Math.random().toString(36).substr(2, 5),
  };
  obj2[obj.id] = obj;
  arr2.push(obj);
}

Tests:

Lodash unionBy two arrays
var result = _.unionBy(arr1, arr2, 'id');
merge two objects
var result = { ...obj1, ...obj2 }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash unionBy two arrays
merge two objects

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.0.0 Safari/537.36

Browser/OS: Chrome 102 on Linux

View result in a separate tab

Test name	Executions per second
Lodash unionBy two arrays	307.6 Ops/sec
merge two objects	122.6 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided JSON to understand what's being tested in this benchmark.

**Benchmark Definition**

The benchmark is designed to compare two approaches for merging data from arrays and objects:

1. **Lodash `unionBy` method**: This function takes two arrays and a common property key, and returns a new array with unique elements.
2. **Spread operator (`...`)**: This syntax allows you to merge two objects by spreading their properties into a new object.

**Options being compared**

The benchmark compares the performance of these two approaches:

* Lodash `unionBy` method
* Spread operator

**Pros and Cons of each approach:**

1. **Lodash `unionBy` method**:
	* Pros:
		+ Well-tested and widely used library function.
		+ Handles duplicate values based on the provided key.
		+ Can be more efficient for large datasets, as it avoids unnecessary merges.
	* Cons:
		+ Requires an external library (Lodash).
		+ May have additional overhead due to the library's initialization.
2. **Spread operator (`...`)**:
	* Pros:
		+ Built-in JavaScript syntax, so no additional libraries are required.
		+ Simple and concise implementation.
		+ Fast and efficient for small to medium-sized datasets.
	* Cons:
		+ May not handle duplicate values correctly (all properties from both objects will be merged).
		+ May lead to performance issues with very large datasets.

**Library and its purpose:**

In the provided benchmark, Lodash is used as a third-party library. Lodash is a popular utility library for JavaScript that provides a wide range of functions for common tasks, such as data manipulation, string formatting, and more. The `unionBy` method in particular is designed to handle array merging with duplicate values based on a specified key.

**Special JS feature or syntax:**

The benchmark uses the spread operator (`...`) syntax, which is a relatively recent addition to JavaScript (introduced in ECMAScript 2018). This syntax allows you to merge two objects into a new object by spreading their properties.

**Other alternatives:**

For merging arrays and objects, other approaches include:

* Using `Set` data structure with array mapping
* Utilizing library functions like `merge` from the `lodash-es` package (a variant of Lodash designed for ES6+ compatibility)
* Implementing a custom merge function using recursion or iteration

Keep in mind that the choice of approach depends on specific requirements, such as performance, complexity, and compatibility with older browsers or versions of JavaScript.

Related benchmarks:

merge data arr vs obj (version: 0)

Comparing performance of: Lodash unionBy two arrays vs merge two objects

Created: 2 years ago by: Registered User

Jump to the latest result

Lodash unionBy two arrays

merge two objects

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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