JavaScript - JavaScript Structured Clone Algorithm

The Structured Clone Algorithm is a JavaScript mechanism used to create a deep copy of many JavaScript values. In modern JavaScript, developers can access this functionality through the structuredClone() method. It is particularly useful when an object contains nested objects, arrays, dates, maps, sets, or circular references and you need an independent copy rather than a reference to the original data.

1. What Is Structured Cloning?

When you assign an object to another variable using the assignment operator, JavaScript does not create a new object. Instead, both variables point to the same object in memory.

const person = {
    name: "Rahul",
    age: 25
};

const copy = person;

copy.name = "Arun";

console.log(person.name);

Output:

Arun

The original object changed because copy and person refer to the same object.

Structured cloning solves this problem by creating a separate copy.

const person = {
    name: "Rahul",
    age: 25
};

const copy = structuredClone(person);

copy.name = "Arun";

console.log(person.name);
console.log(copy.name);

Output:

Rahul
Arun

Here, modifying copy does not modify person.

2. The `structuredClone()` Method

The easiest way to use the Structured Clone Algorithm is the following:

const clonedValue = structuredClone(originalValue);

For example:

const student = {
    name: "Anita",
    age: 21,
    course: "JavaScript"
};

const clonedStudent = structuredClone(student);

console.log(clonedStudent);

The resulting object contains the same data but is a different object.

You can verify this using the strict equality operator:

console.log(student === clonedStudent);

Output:

false

This means the two objects are not the same object in memory.

3. Why Is It Called a Deep Clone?

A deep clone means that nested objects are also copied.

Consider the following object:

const employee = {
    name: "Ravi",
    address: {
        city: "Bengaluru",
        state: "Karnataka"
    }
};

const clonedEmployee = structuredClone(employee);

clonedEmployee.address.city = "Mysuru";

console.log(employee.address.city);
console.log(clonedEmployee.address.city);

Output:

Bengaluru
Mysuru

The nested address object was also cloned.

This is important because simply copying the outer object does not necessarily copy its nested objects.

4. Difference Between Shallow Copy and Structured Clone

A shallow copy copies only the first level of an object. Nested objects can still be shared.

For example:

const user = {
    name: "Priya",
    address: {
        city: "Bengaluru"
    }
};

const shallowCopy = { ...user };

shallowCopy.address.city = "Mysuru";

console.log(user.address.city);

Output:

Mysuru

The nested address object is still shared.

With structuredClone():

const user = {
    name: "Priya",
    address: {
        city: "Bengaluru"
    }
};

const deepCopy = structuredClone(user);

deepCopy.address.city = "Mysuru";

console.log(user.address.city);

Output:

Bengaluru

Therefore:

Method	Outer object copied	Nested objects copied
Assignment `=`	No	No
Spread `{...obj}`	Yes	No
`Object.assign()`	Yes	No
`structuredClone()`	Yes	Yes

5. Cloning Arrays

structuredClone() can also clone arrays.

const numbers = [10, 20, 30, 40];

const clonedNumbers = structuredClone(numbers);

clonedNumbers.push(50);

console.log(numbers);
console.log(clonedNumbers);

Output:

[10, 20, 30, 40]
[10, 20, 30, 40, 50]

The original array remains unchanged.

It also works with nested arrays:

const data = [
    [10, 20],
    [30, 40]
];

const copy = structuredClone(data);

copy[0].push(50);

console.log(data);
console.log(copy);

The nested array is independently cloned.

6. Cloning Date Objects

One advantage of structured cloning is that it can preserve certain built-in JavaScript objects.

For example:

const originalDate = new Date("2026-09-15");

const clonedDate = structuredClone(originalDate);

console.log(clonedDate);
console.log(clonedDate instanceof Date);

Output:

2026-09-15...
true

The result remains a Date object rather than becoming an ordinary object.

7. Cloning Map Objects

Map objects can also be cloned.

const originalMap = new Map();

originalMap.set("name", "Rahul");
originalMap.set("age", 25);

const clonedMap = structuredClone(originalMap);

console.log(clonedMap);

The cloned map contains the same entries.

You can modify the clone independently:

clonedMap.set("city", "Bengaluru");

console.log(originalMap.has("city"));
console.log(clonedMap.has("city"));

Output:

false
true

This demonstrates that the cloned Map is independent of the original.

8. Cloning Set Objects

Set values are also supported.

const originalSet = new Set([10, 20, 30]);

const clonedSet = structuredClone(originalSet);

clonedSet.add(40);

console.log(originalSet);
console.log(clonedSet);

Output:

Set(3) {10, 20, 30}
Set(4) {10, 20, 30, 40}

The original set is not modified.

9. Circular References

One of the important advantages of structured cloning is its ability to handle circular references.

A circular reference occurs when an object refers to itself directly or indirectly.

const user = {
    name: "Ravi"
};

user.self = user;

Here:

user → self → user

The object refers back to itself.

Structured cloning can handle this:

const clonedUser = structuredClone(user);

console.log(clonedUser.name);
console.log(clonedUser.self === clonedUser);

Output:

Ravi
true

The circular structure is preserved in the cloned object.

10. Why JSON Cloning Is Not Always Reliable

Before structuredClone() became widely available, developers sometimes used:

const copy = JSON.parse(JSON.stringify(original));

Although this technique can work for simple objects, it has important limitations.

For example:

const user = {
    name: "Ravi",
    birthDate: new Date()
};

const copy = JSON.parse(JSON.stringify(user));

console.log(copy.birthDate instanceof Date);

Output:

false

The Date object has been converted into a string.

JSON-based cloning also cannot properly preserve several other JavaScript values and cannot handle circular references.

For example:

const user = {};

user.self = user;

const copy = JSON.parse(JSON.stringify(user));

This produces an error because JSON serialization cannot handle the circular structure.

structuredClone() is designed for structured cloning and is therefore much more appropriate when the data contains supported non-JSON types.

11. Values That Cannot Be Structured Cloned

Not every JavaScript value can be cloned.

For example, functions cannot be cloned.

const person = {
    name: "Rahul",
    greet: function() {
        console.log("Hello");
    }
};

const copy = structuredClone(person);

This results in a DataCloneError.

Similarly, certain browser-specific objects and other unsupported values cannot be cloned using the Structured Clone Algorithm.

Therefore, before using structuredClone(), you should understand whether the data contains supported values.

12. Functions Are Not Cloned

Consider:

const calculator = {
    value: 10,
    add: function(number) {
        return this.value + number;
    }
};

Trying to clone this object using:

const copy = structuredClone(calculator);

will fail because the function cannot be structured-cloned.

This is an important difference between ordinary data objects and objects containing executable behavior.

Structured cloning is primarily intended for copying data rather than copying JavaScript functions.

13. Prototype Considerations

Structured cloning does not simply reproduce every aspect of an object exactly as it exists.

For ordinary objects, the resulting clone contains the object's data, but custom prototype relationships and certain property characteristics may not be preserved in the way you might expect.

For example:

class Person {
    constructor(name) {
        this.name = name;
    }

    greet() {
        return "Hello " + this.name;
    }
}

const person = new Person("Ravi");
const copy = structuredClone(person);

The cloned object should not be treated as a new Person instance with all of the class's methods automatically available.

Therefore, structured cloning should be viewed primarily as a data cloning mechanism, not a complete class-instance duplication mechanism.

14. Circular Objects and Deep Data Structures

Structured cloning becomes especially useful when working with complex application data.

For example:

const company = {
    name: "ABC Technologies",
    employees: [
        {
            name: "Ravi",
            skills: ["JavaScript", "HTML"]
        },
        {
            name: "Anita",
            skills: ["CSS", "JavaScript"]
        }
    ]
};

const clonedCompany = structuredClone(company);

The company object, employee array, employee objects, and nested skills arrays are all independently cloned.

Changing the clone:

clonedCompany.employees[0].skills.push("Node.js");

does not change the original company's data.

15. Transferable Objects

Structured cloning also works with certain transferable objects.

A transferable object can have its underlying resources transferred from one JavaScript context to another rather than simply copied.

ArrayBuffer is a common example.

For example:

const buffer = new ArrayBuffer(1024);

const clonedBuffer = structuredClone(buffer, {
    transfer: [buffer]
});

When an ArrayBuffer is transferred, ownership of its underlying memory is moved to the cloned value.

The original buffer becomes detached and can no longer be used normally.

This capability is particularly useful when communicating large binary data between workers because transferring ownership can be more efficient than copying the entire buffer.

16. Structured Clone and Web Workers

One important use of structured cloning is communication between a main browser thread and a Web Worker.

For example, data can be sent to a worker:

worker.postMessage({
    name: "Ravi",
    age: 25
});

The browser uses structured cloning as part of the message-passing process.

This allows complex supported data structures to be passed between execution contexts without simply sharing the same ordinary object reference.

This is one reason structured cloning is important in modern web development.

17. Error Handling

If a value cannot be cloned, structuredClone() can throw a DataCloneError.

You can handle this using try...catch:

try {
    const result = structuredClone({
        calculate: function() {
            return 10;
        }
    });

    console.log(result);
} catch (error) {
    console.log("The value could not be cloned.");
}

This is useful when the source data may contain unsupported values.

18. Structured Clone vs JSON Clone

The two approaches can be compared as follows:

Feature	`structuredClone()`	`JSON.parse(JSON.stringify())`
Deep cloning	Yes	Yes, with limitations
Circular references	Supported	Not supported
Date objects	Preserved as `Date`	Converted to strings
Map	Supported	Not preserved as `Map`
Set	Supported	Not preserved as `Set`
Functions	Not supported	Functions are omitted/altered depending on position
`undefined`	Supported in cloneable structures	Generally lost during JSON serialization
Binary data	Supports several binary types	Limited
Purpose	General structured data cloning	JSON serialization/deserialization

19. Practical Example

Suppose an application stores customer information:

const customer = {
    id: 101,
    name: "Meera",
    address: {
        city: "Bengaluru",
        country: "India"
    },
    orders: [
        {
            product: "Laptop",
            quantity: 1
        },
        {
            product: "Mouse",
            quantity: 2
        }
    ]
};

We can create a complete independent copy:

const backupCustomer = structuredClone(customer);

Now modify the backup:

backupCustomer.address.city = "Mysuru";
backupCustomer.orders[0].quantity = 2;

The original customer remains unchanged:

console.log(customer.address.city);
console.log(customer.orders[0].quantity);

Output:

Bengaluru
1

This demonstrates why deep cloning can be useful when manipulating complex application data without affecting the original object.

20. Advantages of Structured Clone

The Structured Clone Algorithm provides several important benefits.

Deep copying

Nested objects and arrays can be independently copied.

Circular reference support

It can clone supported objects that contain circular references.

Support for built-in data types

Types such as Date, Map, Set, ArrayBuffer, and several other structured-cloneable values can be handled.

Simpler syntax

Instead of manually implementing a deep-copy function, developers can use:

structuredClone(value);

Useful for data communication

It plays an important role in browser APIs that need to transfer structured data between different execution contexts.

21. Limitations

Structured cloning is not a universal solution for copying every JavaScript object.

Important limitations include:

Functions cannot be cloned.
Some browser-specific objects cannot be cloned.
Custom class behavior and prototypes should not be assumed to be preserved.
Cloning large objects can require significant memory and processing time.
It should not be used unnecessarily when a shallow copy is sufficient.

For example, if you only need to copy a simple array:

const numbers = [1, 2, 3];

const copy = [...numbers];

A structured clone would be unnecessary for such a simple case.

22. When Should You Use `structuredClone()`?

You should consider using structuredClone() when:

You need a genuine deep copy.
Your object contains nested structures.
Your data contains supported built-in objects such as Map or Set.
Your data may contain circular references.
You need to clone structured data before modifying it.
You are working with APIs that use structured-clone semantics.

For simple objects where only the first level needs to be copied, spread syntax or Object.assign() may be more appropriate.

23. Key Points to Remember

The Structured Clone Algorithm provides a standardized way to make deep copies of many JavaScript values.

The primary method is:

const copy = structuredClone(original);

Unlike ordinary assignment:

const copy = original;

it creates an independent copy.

Unlike a shallow copy:

const copy = { ...original };

it can independently clone nested supported objects.

It is also more capable than JSON-based cloning because it can handle several JavaScript-specific data types and circular references.

However, it cannot clone everything. Functions and certain unsupported objects cannot be structured-cloned, so structuredClone() should be considered a powerful data-copying mechanism rather than a universal object-duplication solution.

JavaScript - JavaScript Structured Clone Algorithm

1. What Is Structured Cloning?

2. The structuredClone() Method

3. Why Is It Called a Deep Clone?

4. Difference Between Shallow Copy and Structured Clone

5. Cloning Arrays

6. Cloning Date Objects

7. Cloning Map Objects

8. Cloning Set Objects

9. Circular References

10. Why JSON Cloning Is Not Always Reliable

11. Values That Cannot Be Structured Cloned

12. Functions Are Not Cloned

13. Prototype Considerations

14. Circular Objects and Deep Data Structures

15. Transferable Objects

16. Structured Clone and Web Workers

17. Error Handling

18. Structured Clone vs JSON Clone

19. Practical Example

20. Advantages of Structured Clone

Deep copying

Circular reference support

Support for built-in data types

Simpler syntax

Useful for data communication

21. Limitations

22. When Should You Use structuredClone()?

23. Key Points to Remember

2. The `structuredClone()` Method

22. When Should You Use `structuredClone()`?