Benchmark: Angular clone vs Lodash cloneDeep -1

HTML Preparation code:

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>

Script Preparation code:

var MyObject = { 
   	   _id: '{{objectId()}}',
      index: '{{index()}}',
      guid: '{{guid()}}',
      isActive: '{{bool()}}',
      balance: '{{floating(1000, 4000, 2, "$0,0.00")}}',
      picture: 'http://placehold.it/32x32',
      age: '{{integer(20, 40)}}',
      eyeColor: '{{random("blue", "brown", "green")}}',
      name: {
        first: '{{firstName()}}',
        last: '{{surname()}}'
      },
      company: '{{company().toUpperCase()}}',
      email(tags) {
        return `${this.name.first}.${this.name.last}@${this.company}${tags.domainZone()}`.toLowerCase();
      },
      phone: '+1 {{phone()}}',
      address: '{{integer(100, 999)}} {{street()}}, {{city()}}, {{state()}}, {{integer(100, 10000)}}',
      about: '{{lorem(1, "paragraphs")}}',
      registered: '{{moment(this.date(new Date(2014, 0, 1), new Date())).format("LLLL")}}',
      latitude: '{{floating(-90.000001, 90)}}',
      longitude: '{{floating(-180.000001, 180)}}',
      tags: [
        {
          'repeat(5)': '{{lorem(1, "words")}}'
        }
      ],
      range: 'range(10)',
      friends: [
        {
          'repeat(3)': {
            id: '{{index()}}',
            name: '{{firstName()}} {{surname()}}'
          }
        }
      ],
      greeting(tags) {
        return `Hello, ${this.name.first}! You have ${tags.integer(5, 10)} unread messages.`;
      },
      favoriteFruit(tags) {
        const fruits = ['apple', 'banana', 'strawberry'];
        return fruits[tags.integer(0, fruits.length - 1)];
      }
 }

var myCopy = null;

Tests:

Lodash cloneDeep
myCopy = _.cloneDeep(MyObject);
Angular copy
myCopy = angular.copy(MyObject);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Lodash cloneDeep
Angular copy

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 145 on Linux

View result in a separate tab

Test name	Executions per second
Lodash cloneDeep	195216.9 Ops/sec
Angular copy	271554.1 Ops/sec

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

LLMs can make mistakes. Check important info.

I'll break down the provided benchmark and its options, pros, cons, and considerations.

**Benchmark Overview**

The benchmark compares two approaches to create a deep copy of an object:

1. **Lodash cloneDeep**: Uses the `cloneDeep` function from Lodash to create a deep copy of the `MyObject`.
2. **Angular copy**: Uses the `copy` function from Angular to create a deep copy of the `MyObject`.

**Lodash cloneDeep**

* **Purpose**: Create a deep copy of an object, preserving all its nested properties and their values.
* **Pros**:
	+ Fast and efficient, especially for large objects.
	+ Preserves the original object's structure and relationships between its properties.
	+ Widely used and well-maintained library.
* **Cons**:
	+ Requires Lodash to be included in the project, adding extra dependencies.
	+ Can have performance overhead if not necessary.

**Angular copy**

* **Purpose**: Create a shallow copy of an object, preserving only its top-level properties and values.
* **Pros**:
	+ Part of the Angular framework, reducing additional dependencies.
	+ Fast and efficient for small to medium-sized objects.
	+ Easy to use and understand for developers familiar with Angular.
* **Cons**:
	+ Does not preserve nested properties or their values, which might be a problem if not handled carefully.
	+ May have performance overhead compared to `cloneDeep` for large objects.

**Other Considerations**

* **Performance**: Both approaches can have varying performance characteristics depending on the object size and complexity. Lodash's `cloneDeep` is generally faster and more efficient for large objects, while Angular's `copy` might be slower due to its shallow copying nature.
* **Memory Usage**: Lodash's `cloneDeep` creates a new, independent copy of the original object, which can lead to higher memory usage. Angular's `copy`, on the other hand, only copies the top-level properties, potentially reducing memory usage.

**Library and Special JS Features**

* **Lodash**: A popular utility library for JavaScript, providing various functions for tasks like string manipulation, array and object manipulation, and more.
	+ Its `cloneDeep` function is specifically designed to create deep copies of objects, making it a convenient choice for this benchmark.
* **Angular**: A JavaScript framework for building web applications, providing features like dependency injection, services, and templates.
	+ Its `copy` function is part of the Angular framework, making it a good choice when working with Angular projects.

**Test Case Special JS Features**

There are no special JavaScript features or syntax used in this benchmark beyond standard JavaScript language features.

Related benchmarks:

Angular clone vs Lodash cloneDeep -1 (version: 0)

Comparing performance of: Lodash cloneDeep vs Angular copy

Created: 7 years ago by: Guest

Jump to the latest result

Lodash cloneDeep

Angular copy

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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