Benchmark: lodash clone vs object.assign vs for vs spread

HTML Preparation code:

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

Script Preparation code:

var obj =  {
        "tid": 1,
        "cid": 0,
        "uid": 0,
        "mainPid": 0,
        "postcount": 0,
        "viewcount": 0,
        "postercount": 0,
        "deleted": 0,
        "locked": 0,
        "pinned": 0,
        "timestamp": 0,
        "upvotes": 0,
        "downvotes": 0,
        "lastposttime": 0,
        "deleterUid": 0,
        "timestampISO": "",
        "lastposttimeISO": "",
        "votes": 0,
        "teaserPid": null
    };

Tests:

lodash clone
var c = _.clone(obj);
object.assign
var c = Object.assign({}, obj);
for
var copy = {}; for (const k in obj) { copy[k] = obj[k]; }
spread
var copy = { ...obj };

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
lodash clone
object.assign
for
spread

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks and explore what's being tested in this particular benchmark.

**Benchmark Overview**

The test case is designed to compare four different methods for creating a shallow copy of an object:

1. Lodash's `clone` function
2. The `Object.assign()` method
3. A simple loop using the `for...in` loop
4. Spread syntax (`{ ...obj }`)

**Library: Lodash**

The benchmark uses the popular JavaScript utility library Lodash, which provides a wide range of functions for tasks such as string manipulation, array and object manipulation, and more.

In this specific test case, only one function from Lodash is used: `clone`. The `clone` function takes an object as input and returns a deep copy of it. However, in this benchmark, the `clone` function is only used for shallow copying, which means it only copies the top-level properties of the original object without recursively cloning nested objects.

**Options Compared**

The four options are compared in terms of execution speed:

* **Lodash clone**: Creates a shallow copy of the original object using Lodash's `clone` function.
* **Object.assign()**: Uses the `Object.assign()` method to create a new object with the properties of the original object.
* **For loop**: Uses a simple loop to iterate over the properties of the original object and assign each property to a new object.
* **Spread syntax**: Uses the spread syntax (`{ ...obj }`) to create a shallow copy of the original object.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

* **Lodash clone**:
	+ Pros: Fast, efficient, and easy to use.
	+ Cons: Only creates a shallow copy, which may not be suitable for all use cases.
* **Object.assign()**:
	+ Pros: Simple, intuitive, and widely supported.
	+ Cons: May have performance issues if dealing with large objects or complex data structures.
* **For loop**:
	+ Pros: Low-overhead, straightforward, and easy to understand.
	+ Cons: Can be slower than other approaches due to the overhead of iterating over properties.
* **Spread syntax**:
	+ Pros: Modern, concise, and expressive.
	+ Cons: May have performance issues if dealing with large objects or complex data structures.

**Device-Specific Considerations**

The benchmark runs on a Windows 10 desktop device using Chrome 86. It's worth noting that the results may vary depending on the device platform, browser version, and JavaScript engine used.

**Alternatives**

If you're looking for alternative approaches to shallow copying objects in JavaScript, here are some options:

* `JSON.parse(JSON.stringify(obj))`: This method creates a deep copy of the original object but can be slower than other approaches due to the overhead of JSON parsing.
* `Array.prototype.slice.call(obj)`: This method uses the `slice()` method to create a shallow copy of the original object's properties.

In summary, this benchmark provides valuable insights into the performance characteristics of different methods for creating shallow copies of objects in JavaScript. By understanding the pros and cons of each approach, developers can make informed decisions about which method to use depending on their specific requirements and performance needs.

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.111 Safari/537.36

Browser/OS: Chrome 86 on Windows

View result in a separate tab

Test name	Executions per second
lodash clone	473738.1 Ops/sec
object.assign	1383113.1 Ops/sec
for	352297.3 Ops/sec
spread	7071207.0 Ops/sec

Related benchmarks:

lodash clone vs object.assign vs for vs spread (version: 0)

Comparing performance of: lodash clone vs object.assign vs for vs spread

Created: 4 years ago by: Guest

Jump to the latest result

lodash clone

object.assign

for

spread

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