Run results for: Lodash cloneDeep vs for loop vs JSON parse vs recursive clone deep vs recursive reduce clone deep

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/87.0.4280.88 Safari/537.36

Browser: Chrome 87

Operating system: Mac OS X 10.15.6

Device Platform: Desktop

Date tested: 3 years ago

Test name	Executions per second
Lodash cloneDeep	454600.4 Ops/sec
JSON parse	385351.9 Ops/sec
For loop	442635.8 Ops/sec
Recursive clone deep	890919.1 Ops/sec
Recursive reduce clone deep	246873.5 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 obj = {a: "hello", c: "test", num: 3, arr: [1, 2, 3, 4], anotherObj: {a: 35, str: "tester"}};

var deepClone = function(obj) {
    var out = null;
    
    if (Array.isArray(obj)) {
        out = [];
        for (var index = 0; index < obj.length; ++index) {
            var subArray = obj[index];
            out.push((typeof subArray === 'object') ? deepClone(subArray) : subArray);
        }
    } else {
        out = {};
        for (var key in obj) {
            var subObject = obj[key];
            out[key] = (typeof subObject === 'object') ? deepClone(subObject) : subObject;
        }
    }
    return out;
};

 function cloneArray(value) {
    var newArray;
    if (value && value.length) {
      newArray = [];
      for (var i = 0; i < value.length; i++) {
        if (typeof value[i] === 'object') {
          newArray[i] = Array.isArray(value[i]) ? cloneArray(value[i]) : cloneObject(value[i]);
        } else {
          newArray[i] = value[i];
        }
      }
    } else if (value === null) {
      newArray = null;
    }
    return newArray;
  }

  function cloneObject(value) {
    var newObject;
    if (value && typeof value === 'object' && Object.keys(value).length > 0) {
      newObject = {};
      for (var key in value) {
        if (typeof value[key] === 'object') { 
          newObject[key] = Array.isArray(value) ? cloneArray(value[key]) : cloneObject(value[key]);
        } else {
          newObject[key] = value[key];
        }
      }
    } else if (value && typeof value === 'object' && Object.keys(value).length === 0) {
      newObject = {};
    } else if (value === null) {
      newObject = null;
    }
    return newObject;
  }

function reduceDeepClone(obj) {
  return Object.keys(obj).reduce((v, d) => Object.assign(v, {
    [d]: (obj[d].constructor === Object) ? reduceDeepClone(obj[d]) : obj[d]
  }), {});
}

Tests:

Lodash cloneDeep
testCopy = _.cloneDeep(obj);
JSON parse
testCopy = JSON.parse(JSON.stringify(obj));
For loop
testCopy = cloneObject(obj);
Recursive clone deep
testCopy = deepClone(obj);
Recursive reduce clone deep
testCopy = reduceDeepClone(obj);

Run results for: Lodash cloneDeep vs for loop vs JSON parse vs recursive clone deep vs recursive reduce clone deep

compare object deep copy/clone methods

Lodash cloneDeep

JSON parse

For loop

Recursive clone deep

Recursive reduce clone deep