Run results for: deep copy methods

Run details:

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

Browser: Chrome 118

Operating system: Windows

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
Spread	8024161.5 Ops/sec
Object.assign	3722678.0 Ops/sec
JSON methods	56378.8 Ops/sec
Lodash cloneDeep	56434.4 Ops/sec

HTML Preparation code:

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

Script Preparation code:

var source = {
  "id": "31830115-0ab0-4167-b2b8-c4d84aa2b8e0",
  "name": "Variable usage playground",
  "externalId": "pXlIb5TeR5FuUjLirE8CWo",
  "pages": [
    {
      "id": "f5328546-b7bb-484b-952f-f4fa59bba425",
      "externalId": "0:1",
      "frames": [
        {
          "id": "14563074-6003-4094-ba45-603e1e1f888e",
          "name": "Collections",
          "versions": [
            {
              "id": "7bd3596f-f42c-4ab7-9270-c16e0ecd2e34",
              "name": "Collections",
              "externalId": "1:22",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "93c6d160-5838-4ec6-a420-db63486e8dad",
          "name": "a1 / group2",
          "versions": [
            {
              "id": "7bbd6104-d6f2-47ca-ac4f-0159acd4e4f7",
              "name": "2.1.1 (Color, fill)",
              "externalId": "1:36",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "c823da23-e180-45c0-a5e6-c61f2d1a4685",
          "name": "a1 / 2.1.2 (Number, border-radius)",
          "versions": [
            {
              "id": "9c26d86a-d67f-4675-99ee-da75394ef7a6",
              "name": "2.1.2 (Number, border-radius)",
              "externalId": "1:37",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "713c578d-6f8a-460b-92ee-5db8f181d4fe",
          "name": "UntitledGroup 10.20.2023, 20:57:15/2.1.3 (String, text layer)333",
          "versions": [
            {
              "id": "7fa5f591-135d-4c3c-bbbb-d4a652959212",
              "name": "2.1.3 (String, text layer)",
              "externalId": "1:38",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "8f40f29f-208a-4b11-97a2-aaecf45b37f1",
          "name": "UntitledGroup 10.20.2023, 20:57:15/2.1.4 (Boolean, prototype)",
          "versions": [
            {
              "id": "885e6b1b-8809-4307-8a2c-0d5a7a81584a",
              "name": "2.1.4 (Boolean, prototype)",
              "externalId": "1:40",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "92fe00a2-880b-4f99-b56d-d2ec31c068d6",
          "name": "2.2.1 (Color, fill)",
          "versions": [
            {
              "id": "c9751c0d-3b7f-49fb-b79a-49ffc133da5a",
              "name": "2.2.1 (Color, fill)",
              "externalId": "1:43",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "aa474716-ff4a-4d49-a8ea-72eb34ae1cf8",
          "name": "group111/2.2.2 (Number, border-radius)",
          "versions": [
            {
              "id": "fee127fc-e6d8-42ed-8075-df7af9ac0a59",
              "name": "2.2.2 (Number, border-radius)",
              "externalId": "1:44",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "8ebabc48-5ffd-4e54-9869-56fc57f688b0",
          "name": "group2/2.2.4 (Boolean, prototype)",
          "versions": [
            {
              "id": "dc29c45f-9a3d-491a-8e90-a06810df2a1e",
              "name": "2.2.4 (Boolean, prototype)",
              "externalId": "1:47",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "e1cd2bfc-9cce-4544-a14e-63037cb568ed",
          "name": "3.1 (Color, fill + Number, border-radius)",
          "versions": [
            {
              "id": "6b7731d1-23fb-4b2a-91ea-c3db97ff6c0c",
              "name": "3.1 (Color, fill + Number, border-radius)",
              "externalId": "2:69",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "6e4c8c16-8567-408d-a121-f34d019f6cf7",
          "name": "3.2 (Color, text fill + String, text layer)",
          "versions": [
            {
              "id": "8df77f07-9ded-416c-a9dd-4bb068de02cf",
              "name": "3.2 (Color, text fill + String, text layer)",
              "externalId": "2:70",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        },
        {
          "id": "2aefefcc-d7d5-4caf-a19c-64d5af9b0c9d",
          "name": "3.3 (Number, width + Number, height, + Number, border-radius)/group1",
          "versions": [
            {
              "id": "e1b17f47-08d1-4025-b1e1-cd60069fbade",
              "name": "3.3 (Number, width + Number, height, + Number, border-radius)",
              "externalId": "2:72",
              "version": 1,
              "createdAt": 1698402406719,
              "updatedAt": 1698402406719
            }
          ]
        }
      ]
    }
  ]
};

function spreadCopy (data) {
	const copy = { ...data };
    return copy;
}

function assignCopy (data) {
	const copy = Object.assign({}, data);
  	return copy;
}

function JSONCopy (data) {
	const copy = JSON.parse(JSON.stringify(data));
  	return copy;
}

function lodashCopy (data) {
	const copy = _.cloneDeep(data);
	return copy;
}

Tests:

Spread
spreadCopy(source)
Object.assign
assignCopy(source)
JSON methods
JSONCopy(source)
Lodash cloneDeep
lodashCopy(source)

Run results for: deep copy methods

compare spread, object.assign, JSON methods and lodash deepClone

Spread

Object.assign

JSON methods

Lodash cloneDeep