Benchmark: structuredClone vs _.cloneDeep vs JSON vs rfdc

HTML Preparation code:

<!--your preparation HTML code goes here-->
<script>
window.module = {};
</script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js'></script>
<script src='https://unpkg.com/rfdc@1.4.1/index.js'></script>
<script>
window.rfdc = module.exports;
</script>

Script Preparation code:

var clone = rfdc()
function generateDeterministicTree(depth = 8, breadth = 6) {
  function createLevel(level) {
    if (level >= depth) {
      // На листьях — детерминированное значение (например, строка с номером)
      return `leaf_${level}`;
    }
    if (level % 2 === 0) { // Чётный — объект
      const obj = {};
      for (let i = 0; i < breadth; i++) {
        obj[`key_${level}_${i}`] = createLevel(level + 1);
      }
      return obj;
    } else { // Нечётный — массив
      const arr = [];
      for (let i = 0; i < breadth; i++) {
        arr.push(createLevel(level + 1));
      }
      return arr;
    }
  }
  return createLevel(0);
}

// Пример использования:
var data = generateDeterministicTree(8, 6);

Tests:

JSON
JSON.parse(JSON.stringify(data))
Lodash
_.cloneDeep(data)
rfdc
clone(data)
Native
structuredClone(data)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
JSON
Lodash
rfdc
Native

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 8 months ago)

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

Browser/OS: Chrome 139 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
JSON	25.2 Ops/sec
Lodash	8.4 Ops/sec
rfdc	33.3 Ops/sec
Native	13.9 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 9 months ago):

LLMs can make mistakes. Check important info.

The benchmark provided compares four different methods of deep cloning JavaScript objects. The methods being tested are:

1. **`JSON.parse(JSON.stringify(data))`** (commonly referred to as "JSON")
2. **`_.cloneDeep(data)`** (using Lodash, a popular utility library)
3. **`clone(data)`** (using `rfdc`, a fast deep cloning library)
4. **`structuredClone(data)`** (a native JavaScript function introduced in newer browsers)

### Comparison of Options

#### 1. JSON (JSON.parse(JSON.stringify(data)))
- **Pros**: 
  - Simple to implement and understand.
  - No external dependencies required.
- **Cons**: 
  - Does not handle functions, undefined values, Maps, Sets, or objects with circular references, leading to loss of data.
  - Potential performance issues for large or complex objects due to the serialization/deserialization process.

#### 2. Lodash (_.cloneDeep(data))
- **Pros**: 
  - Comprehensive handling for various types including arrays, objects, and more complex structures.
  - Manages circular references effectively.
- **Cons**: 
  - Requires a library, additional weight to the project.
  - Performance can be slower than other methods, especially for large datasets.

#### 3. rfdc (clone(data))
- **Pros**: 
  - Specifically optimized for speed and performance, making it one of the fastest cloning methods available.
  - Handles a wide variety of data types including arrays and objects.
- **Cons**: 
  - Relatively new and less known than Lodash, meaning fewer community resources and support could be available.
  - Needs an external library, though it is lightweight.

#### 4. Native (`structuredClone(data)`)
- **Pros**: 
  - Built-in method in modern browsers, so no additional libraries are needed.
  - Supports more complex cases, such as circular references, and different data types (like Date, Map, Set).
- **Cons**: 
  - Limited compatibility with older browsers or environments that do not support the method.
  - Still relatively new, so it's important to check compatibility for broader applications.

### Benchmark Results
From the provided results, we can summarize the performance of each option in terms of executions per second:

- **rfdc**: 12.10 executes per second, making it the fastest option.
- **JSON**: 5.34 executes per second, significantly slower than rfdc but faster than the other two methods.
- **structuredClone**: 3.10 executes per second, indicating moderate performance.
- **Lodash**: 2.82 executes per second, making it the slowest of all options compared.

### Conclusion and Other Considerations
Choosing the right deep cloning method depends on the specific needs of your project:

- **Use `JSON.parse(JSON.stringify(data))`** if you need a quick solution for simple data structures without complex needs or if you want to avoid dependencies.
- **Opt for Lodash (`_.cloneDeep(data)`)** when you need comprehensive cloning capabilities, especially with complex objects and structures.
- **Consider `rfdc (clone(data))`** for high-performance needs with modern JavaScript support and when working with potentially large datasets.
- **Utilize `structuredClone(data)`** when you are in a modern environment and require built-in support for complex structures.

Additionally, developers can explore other libraries like **DeepClone** or **clone-deep**, and custom recursive functions, depending on performance and feature requirements. However, each approach will generally share similar trade-offs related to performance, dependencies, and handling of different data types.

Related benchmarks:

structuredClone vs _.cloneDeep vs JSON vs rfdc (version: 1)

Comparing performance of: JSON vs Lodash vs rfdc vs Native

Created: 9 months ago by: Guest

Jump to the latest result

JSON

Lodash

rfdc

Native

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 9 months ago):