Benchmark: Angular Copy vs Lodash Copy Vs native

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.16.1/lodash.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script>

Script Preparation code:

var obj = {
		"crossKey": "EURUSD",
		"dayLowPrice": 1.13045,
		"dayHighPrice": 1.13535,
		"previousClosePrice": 1.13215,
		"priceHist1": 107190404,
		"priceHist2": 250587665,
		"priceHist3": 765906410,
		"priceHist4": 274925633,
		"sparkline": 102925375,
		"spotPrice": 1.1307,
		"midPrice": 1.1307,
		"precision": 4,
		"percentChanged": -0.128,
		"threeMonthForecast": 1.08,
		"sixMonthForecast": 1.04,
		"tradable": true,
		"deliverable": true,
		"key": "EURUSD",
		"displayName": "EUR USD",
		"symbolId": "EURUSD",
		"objectId": 1,
		"assetType": "fx",
		"percentChange": -0.13,
		"selected": true,
		"lineChart": "9991581684158672254519078266440407",
		"barChart": [9, 43, 92, 47, 41, 21, 75, 32, 51, 19, 56, 97, 89, 36, 70, 2, 83, 61, 88, 47, 31, 54],
		"candleChart": "3869460804391469604270058742695196",
		"midPriceModel": "Price: key EURUSD, rate 1.1307, precision 4, appendFrac false, => 1.13 07 ",
		"spotPriceModel": "Price: key EURUSD, rate 1.1307, precision 4, appendFrac false, => 1.13 07 ",
		"crossCurrencies": ["EUR", "USD"],
		"unpackedSparkLine": {
			"price": 2,
			"priceDirection": 1,
			"fiveMinHigh": 4,
			"fiveMinLow": 0,
			"spike": 0,
			"scale": 30
		},
		"priceHistory": [3, 6, 7, 6, 4, 4, 7, 14, 31, 10, 16, 17, 22, 26, 13, 19, 15, 10, 8, 6, 6, 2, 2, 1]
	};

Tests:

Angular copy
angular.copy(obj);
Lodash Deep Clone
_.cloneDeep(obj);
Native
JSON.parse(JSON.stringify(obj))

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Angular copy
Lodash Deep Clone
Native

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks!

**Benchmark Definition**

The benchmark is designed to compare three approaches for copying an object:

1. Angular's `copy` function
2. Lodash's `cloneDeep` function
3. Native JavaScript's `JSON.parse(JSON.stringify(obj))`

The benchmark creates a sample object `obj` with various properties, including nested objects and arrays.

**Benchmark Preparation Code**

The preparation code includes two scripts:

* The first script includes the Angular framework, which is used for the "Angular copy" test case.
* The second script includes Lodash's library, which is used for the "Lodash Deep Clone" test case.

These libraries are included to provide the necessary functions for the benchmark tests.

**Test Cases**

There are three individual test cases:

1. **Angular Copy**: This test case uses Angular's `copy` function to copy the `obj` object.
2. **Lodash Deep Clone**: This test case uses Lodash's `cloneDeep` function to create a deep clone of the `obj` object.
3. **Native**: This test case uses native JavaScript's `JSON.parse(JSON.stringify(obj))` method to create a copy of the `obj` object.

**Pros and Cons**

Here are some pros and cons for each approach:

* **Angular Copy**:
	+ Pros: Angular provides a built-in function for copying objects, which can be efficient.
	+ Cons: The implementation may not be optimized for performance, and it's specific to the Angular framework.
* **Lodash Deep Clone**:
	+ Pros: Lodash provides a robust and flexible way to clone objects, with support for deep cloning and custom serialization.
	+ Cons: Adding an extra dependency on Lodash, which may impact performance or load times.
* **Native**: 
	+ Pros: Using native JavaScript can be more efficient than using external libraries.
	+ Cons: The implementation may require more manual effort and may not be as robust as the other approaches.

**Library and Purpose**

The two libraries used in this benchmark are:

* Angular: A JavaScript framework for building web applications. In this context, it's being used to provide a built-in function for copying objects.
* Lodash: A utility library that provides functions for working with arrays, objects, and other data structures. The `cloneDeep` function is used to create a deep clone of the `obj` object.

**Other Considerations**

When choosing an approach for copying objects in JavaScript, consider the following:

* Performance: Native JavaScript may be faster than using external libraries.
* Robustness: Lodash's `cloneDeep` function provides more robust and flexible cloning capabilities.
* Load Times: Using external libraries like Angular or Lodash can impact load times due to added dependencies.

**Alternatives**

If you're interested in exploring alternative approaches, here are a few options:

* **For native JavaScript**: Consider using the spread operator (`{...obj}`) or `Object.assign()` for creating shallow copies.
* **For external libraries**: Look into other utility libraries like Immutable.js or Fast-JSON for more efficient JSON serialization and deserialization.

Keep in mind that these alternatives may not provide the same level of robustness as Lodash's `cloneDeep` function, but they can offer improved performance or simplified code.

Related benchmarks:

Angular Copy vs Lodash Copy Vs native (version: 0)

compare object copy

Comparing performance of: Angular copy vs Lodash Deep Clone vs Native

Created: 6 years ago by: Guest

Jump to the latest result

Angular copy

Lodash Deep Clone

Native

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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