Run results for: structuredClone vs alternatives test - complex object

Run details:

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

Browser: Chrome 126

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 2 months ago

Test name	Executions per second
Lodash cloneDeep	45000.7 Ops/sec
Native JSON parse	57330.4 Ops/sec
Recursive deep clone	46832.2 Ops/sec
structuredClone	49831.0 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 testArray = [{
    description: 'Random description.',
    testNumber: 123456789,
    testBoolean: true,
    testObject: {
        testString: 'test string',
        testNumber: 12345
    },
    testArray: [{
        myName: 'test name',
        myNumber: 123245
    }],
    children: {
        description: 'Random description.',
        testNumber: 123456789,
        testBoolean: true,
        testObject: {
            testString: 'test string',
            testNumber: 12345
        },
        testArray: [{
            myName: 'test name',
            myNumber: 123245
        }],
        children: {
            description: 'Random description.',
            testNumber: 123456789,
            testBoolean: true,
            testObject: {
                testString: 'test string',
                testNumber: 12345
            },
            testArray: [{
                myName: 'test name',
                myNumber: 123245
            }],
            children: {
                description: 'Random description.',
                testNumber: 123456789,
                testBoolean: true,
                testObject: {
                    testString: 'test string',
                    testNumber: 12345
                },
                testArray: [{
                    myName: 'test name',
                    myNumber: 123245
                }],
                children: {
                    description: 'Random description.',
                    testNumber: 123456789,
                    testBoolean: true,
                    testObject: {
                        testString: 'test string',
                        testNumber: 12345
                    },
                    testArray: [{
                        myName: 'test name',
                        myNumber: 123245
                    }],
                    children: {
                        description: 'Random description.',
                        testNumber: 123456789,
                        testBoolean: true,
                        testObject: {
                            testString: 'test string',
                            testNumber: 12345
                        },
                        testArray: [{
                            myName: 'test name',
                            myNumber: 123245
                        }],
                        children: {
                            description: 'Random description.',
                            testNumber: 123456789,
                            testBoolean: true,
                            testObject: {
                                testString: 'test string',
                                testNumber: 12345
                            },
                            testArray: [{
                                myName: 'test name',
                                myNumber: 123245
                            }],
                            children: {
                                description: 'Random description. Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.',
                                testNumber: 123456789,
                                testBoolean: true,
                                testObject: {
                                    testString: 'test string',
                                    testNumber: 12345
                                },
                                testArray: [{
                                    myName: 'test name',
                                    myNumber: 123245
                                }],
                                children: {
                                    description: 'Random description.',
                                    testNumber: 123456789,
                                    testBoolean: true,
                                    testObject: {
                                        testString: 'test string',
                                        testNumber: 12345
                                    },
                                    testArray: [{
                                        myName: 'test name',
                                        myNumber: 123245
                                    }],
                                    children: {
                                        description: 'Random description.',
                                        testNumber: 123456789,
                                        testBoolean: true,
                                        testObject: {
                                            testString: 'test string',
                                            testNumber: 12345
                                        },
                                        testArray: [{
                                            myName: 'test name',
                                            myNumber: 123245
                                        }],
                                        children: {
                                            description: 'Random description.',
                                            testNumber: 123456789,
                                            testBoolean: true,
                                            testObject: {
                                                testString: 'test string',
                                                testNumber: 12345
                                            },
                                            testArray: [{
                                                myName: 'test name',
                                                myNumber: 123245
                                            }],
                                            children: {
                                                description: 'Random  Random description.Random description.Random description.Random description.Random description.Random description. description.',
                                                testNumber: 123456789,
                                                testBoolean: true,
                                                testObject: {
                                                    testString: 'test string',
                                                    testNumber: 12345
                                                },
                                                testArray: [{
                                                    myName: 'test name',
                                                    myNumber: 123245
                                                }],
                                                children: {
                                                    description: 'Random description.',
                                                    testNumber: 123456789,
                                                    testBoolean: true,
                                                    testObject: {
                                                        testString: 'test string',
                                                        testNumber: 12345
                                                    },
                                                    testArray: [{
                                                        myName: 'test name',
                                                        myNumber: 123245
                                                    }],
                                                    children: {
                                                        description: 'RaRandom description.Random description.Random description.Random description.Random description.ndom description.',
                                                        testNumber: 123456789,
                                                        testBoolean: true,
                                                        testObject: {
                                                            testString: 'testRandom description.Random description.Random description.Random description. string',
                                                            testNumber: 12345
                                                        },
                                                        testArray: [{
                                                            description: 'Random description. Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.',
                                                            myName: 'test name',
                                                            myNumber: 123245
                                                        }],
                                                        children: {
                                                            description: 'Random description.',
                                                            testNumber: 123456789,
                                                            testBoolean1: new Date(),
                                                            testObject: {
                                                                testString: 'test string',
                                                                testNumber: 12345
                                                            },
                                                            testArray: [{
                                                                myName: 'test name',
                                                                myNumber: 123245
                                                            }],
                                                            children: {
                                                                description: 'Random description. Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.',
                                                                description1: 'Random description.',
                                                                testNumber: 123456789,
                                                                testBoolean1: true,
                                                                testObject: {
                                                                    testString: 'test string',
                                                                    testNumber: 12345
                                                                },
                                                                testArray: [{
                                                                    description: 'Random description. Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.Random description.',
                                                                    testBoolean1: new Date(),
                                                                    myName: 'test name',
                                                                    myNumber: 123245,
                                                                    testBoolean: new Date()
                                                                }]
                                                            }
                                                        }
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}];

var testCopy = null;

var deepClone = function(obj) {
    var out;
    if (Array.isArray(obj)) {
        out = [];
        for (var index = 0; index < obj.length; ++index) {
            let subArray = obj[index];
            out.push((subArray === null) ? subArray : (subArray instanceof Date) ? new Date(subArray.valueOf()) : (typeof subArray === 'object') ? deepClone(subArray) : subArray);
        }
    } else {
        out = {};
        for (var key in obj) {
            var subObject = obj[key];
            out[key] = subObject === null ? subObject : subObject instanceof Date ? new Date(subObject.valueOf()) : (typeof subObject === 'object') ? deepClone(subObject) : subObject;


        }
    }
    return out;
};

Tests:

Lodash cloneDeep
testCopy = _.cloneDeep(testArray);
Native JSON parse
testCopy = JSON.parse(JSON.stringify(testArray));
Recursive deep clone
testCopy = deepClone(testArray);
structuredClone
testCopy = structuredClone(testArray);

Run results for: structuredClone vs alternatives test - complex object

compare object deep clone methods

Lodash cloneDeep

Native JSON parse

Recursive deep clone

structuredClone