Run results for: Cloning benchmarking

Run details:

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

Browser: Chrome 113

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: one year ago

Test name	Executions per second
Spread operator (...)	3676258.8 Ops/sec
JSON.parse(JSON.stringify())	264454.9 Ops/sec
Custom function	568597.3 Ops/sec
Lodash.cloneDeep()	342635.4 Ops/sec
jQuery.extend(true)	463955.4 Ops/sec
structuredClone()	235322.0 Ops/sec

HTML Preparation code:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js" integrity="sha512-WFN04846sdKMIP5LKNphMaWzU7YpMyCU245etK3g/2ARYbPK9Ub18eG+ljU96qKRCWh+quCY7yefSmlkQw1ANQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Tests:

Spread operator (...)
// base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = { ...base };
JSON.parse(JSON.stringify())
// base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = JSON.parse(JSON.stringify(base));
Custom function
function clone(aObject) { // Prevent undefined objects // if (!aObject) return aObject; let bObject = Array.isArray(aObject) ? [] : {}; let value; for (const key in aObject) { // Prevent self-references to parent object // if (Object.is(aObject[key], aObject)) continue; value = aObject[key]; bObject[key] = (typeof value === "object") ? clone(value) : value; } return bObject; }; // base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = clone(base);
Lodash.cloneDeep()
// base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = _.cloneDeep(base);
jQuery.extend(true)
// base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = jQuery.extend(true, {}, base);
structuredClone()
// base object const base = { firstName: 'John', lastName: 'Doe', size: 170, birthDate: new Date(1985, 0,15), married: true, address: { street: '2 av Victor Hugo', country: 'FR', }, childrens: [ { name: 'Paul', age: 8, }, ], functions: [], }; const copy = structuredClone(base);

Run results for: Cloning benchmarking

Comparing performance of: spread ... vs vs JSON.parse(JSON.stringify()) vs Custom function vs Lodash.cloneDeep() vs jQuery.extend(true) vs structuredClone()

Spread operator (...)

JSON.parse(JSON.stringify())

Custom function

Lodash.cloneDeep()

jQuery.extend(true)

structuredClone()