<script src="https://cdn.jsdelivr.net/npm/immer@3.1.3/dist/immer.umd.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/ramda/0.25.0/ramda.min.js"></script>
state = {
data: {
data1: {
data2: 'test',
},
data3: Array.from({length: 1000}).map(() => document.createElement('div'))
}
};
const result = immer.produce(state, draft => { draft.data.data1.data2 = 'updated' })
const result = _.cloneDeep(state);
result.data.data1.data2 = 'updated';
const result = R.clone(state);
result.data.data1.data2 = 'updated';
--enable-precise-memory-info
flag.
Test case name | Result |
---|---|
Produce | |
CloneDeep | |
Ramda |
Test name | Executions per second |
---|---|
Produce | 385939.8 Ops/sec |
CloneDeep | 4237.1 Ops/sec |
Ramda | 4158.4 Ops/sec |
Benchmark Overview
The provided benchmark measures the performance of three JavaScript libraries: Ramda, Lodash CloneDeep, and Immer Produce, in terms of cloning/deep copying and updating data structures. The benchmark is designed to test these libraries under heavy loads.
Tested Options
The three options being compared are:
cloneDeep
, which creates a completely independent copy of an object or array, including all nested properties.clone
.Pros and Cons
cloneDeep
.clone
, which can be used for deep copying. Ramda encourages functional programming principles.Library and Syntax
clone
. Ramda's syntax can take some time to get used to, but it encourages a more functional programming approach.Special Features or Syntax
The benchmark does not explicitly test special features like async/await, promises, or ES6+ syntax. However, the libraries being compared are generally compatible with these modern JavaScript features.
Other Alternatives
For deep cloning and data updates, consider using:
clone
, jQuery's $.clone()
method can still be used for deep cloning.In summary, the benchmark provides an excellent comparison of three popular libraries for deep cloning and updating data structures in JavaScript. The choice ultimately depends on your specific needs, the size and complexity of your project, and your familiarity with each library's syntax and features.