<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>permutations = new Array(10000).map(() => ({ pagination: 'blah blah blah' }));function updatePagination(action, prev) { return action;}action = 'something else';state = { data: { permutations: [] } };index = 5;const updated = Object.assign([permutations], { [index]: Object.assign({}, permutations[index], { pagination: updatePagination(action, permutations[index]) })})return { state, data: { state.data, permutations: updated } };const updated = Object.assign([permutations], { [index]: { permutations[index], pagination: updatePagination(action, permutations[index]) }})return { state, data: { state.data, permutations: updated } };--enable-precise-memory-info flag.
| Test case name | Result |
|---|---|
| Spread operator | |
| Spread operator v2 |
| Test name | Executions per second |
|---|---|
| Spread operator | 75015.3 Ops/sec |
| Spread operator v2 | 79680.3 Ops/sec |
This benchmark compares different approaches to updating an object within a larger array.
Let's break down the scenarios:
permutations) and need to modify a specific object at a given index (index). The modification involves changing the pagination property.Test Cases:
...) to create a new array. It assigns a newly constructed object (with updated pagination) at the specified index within this new array. The result is then merged back into the original state object. Libraries Used:
set method against the spread syntax approaches.Considerations:
map) can vary depending on the size and complexity of your data.Alternatives:
Array.map():
map() and update the object at the desired index within the mapped array. This approach often provides good control over the modification process.Original Object Modification (if mutable):
pagination property of the existing object within the array. However, this can have implications for immutability and potential side effects in larger applications.Let me know if you'd like a deeper dive into any specific aspect!
