Benchmark: Angular Copy vs Lodash Copy Vs native vs other and stringsaved

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]
	};

var hiString = JSON.stringify(obj)

Tests:

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

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.

Measuring JavaScript performance is crucial in modern web development, especially when working with complex data structures like objects. Let's break down the benchmark and explain what's being tested.

**Benchmark Definition**
The benchmark compares the performance of three methods to create a copy of an object:

1. Angular's `copy()` function
2. Lodash's `cloneDeep()` function
3. Native JavaScript's built-in `JSON.parse()` method (although this is not exactly creating a deep copy, but rather parsing a JSON string)

**Options Compared**

* **Angular Copy**: This uses the `angular.copy()` function to create a shallow copy of the object.
	+ Pros: Simple and straightforward, widely used in Angular applications.
	+ Cons: Creates only a reference to the original object's properties, not a new, independent object. This can lead to unexpected behavior if the original object is modified later.
* **Lodash Deep Clone**: This uses Lodash's `cloneDeep()` function to create a deep copy of the object.
	+ Pros: Creates an entirely new, independent object with all its own properties and references.
	+ Cons: Requires an external library (Lodash) and may have additional dependencies.
* **Native JavaScript**: This uses native JavaScript's built-in `JSON.parse()` method to parse a JSON string representation of the object.
	+ Pros: No external libraries required, can be simple to implement.
	+ Cons: Not actually creating a copy of the object; rather, parsing a string representation. This may not be what the user expects.

**Other Considerations**

When working with objects in JavaScript, it's essential to understand that simply assigning an object to a new variable doesn't create a new, independent object. Instead, you're creating a reference to the original object's properties. If you modify the referenced object later, changes will be reflected in the copy.

For example:
```javascript
const obj = { foo: 'bar' };
const copy = obj; // Create a shallow copy

copy.foo = 'baz'; // Modify the copied object
console.log(obj); // Output: { foo: 'baz' }
```
In contrast, using a deep cloning method like Lodash's `cloneDeep()` ensures that any modifications made to the original object won't affect the clone.

**Library Used (Lodash)**

Lodash is a popular JavaScript utility library that provides various functions for working with arrays, objects, and other data structures. In this case, the `cloneDeep()` function is used to create a deep copy of the object.

**Special JS Feature/Syntax**

There doesn't appear to be any special JavaScript features or syntax being used in this benchmark beyond the standard ECMAScript syntax.

**Alternatives**

If you need to create copies of objects in your own code, consider using libraries like Lodash or implementing your own deep cloning algorithm. You can also use built-in methods like `Array.prototype.slice()` and `Object.assign()` to create shallow copies, but be aware that these may not preserve all properties or references.

Keep in mind that the choice of copying method depends on the specific requirements of your application and the trade-offs you're willing to make between simplicity, performance, and memory usage.

Related benchmarks:

Angular Copy vs Lodash Copy Vs native vs other and stringsaved (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):