Run results for: Lodash cloneDeep vs JSON parse+stringify vs native deepClone vs structuredClone with large object

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:108.0) Gecko/20100101 Firefox/108.0

Browser: Firefox 108

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
lodash	22443.9 Ops/sec
Native JSON parse	20565.3 Ops/sec
Native deepClone	83760.5 Ops/sec
Native structuredClone	23998.8 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 testObject = {
  someKey: {
    someKey1:
      "some text some text some text some text some text some text some text some text",
    someKey2:
      "some text some text some text some text some text some text some text some text",
    someKey3: [
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3:
          "some text some text some text some text some text some text some text some text",
      },
      {
        someKey1:
          "some text some text some text some text some text some text some text some text",
        someKey2: null,
        someKey3: [
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
          {
            someKey1:
              "some text some text some text some text some text some text some text some text",
            someKey2:
              "some text some text some text some text some text some text some text some text",
          },
        ],
      },
    ],
  },
};

function deepClone(obj) {
  return Object.keys(obj).reduce(
    (acc, key) => {
      acc[key] = getValue(obj[key]);
      return acc;
    },
    { ...obj }
  );
}

function getValue(value) {
  if (Array.isArray(value)) {
    return value.map(getValue);
  }

  if (value && typeof value === "object") {
    return deepClone(value);
  }

  return value;
}

function deepClone2(obj) {
  return Object.keys({ ...obj }).reduce(
    (acc, key) => {
      acc[key] = getValue2(obj[key]);
      return acc;
    },
    { ...obj }
  );
}

function getValue2(value) {
  if (!value || typeof value !== "object") {
    return value;
  }

  return Array.isArray(value) ? value.map(getValue) : deepClone2(value);
}

var testCopy = null;

Tests:

lodash
testCopy = _.cloneDeep(testObject);
Native JSON parse
testCopy = JSON.parse(JSON.stringify(testObject));
Native deepClone
testCopy = deepClone(testObject);
Native structuredClone
testCopy = structuredClone(testObject);

Run results for: Lodash cloneDeep vs JSON parse+stringify vs native deepClone vs structuredClone with large object

lodash

Native JSON parse

Native deepClone

Native structuredClone