Run results for: State update

Run details:

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:70.0) Gecko/20100101 Firefox/70.0

Browser: Firefox 70

Operating system: Linux

Device Platform: Desktop

Date tested: 5 years ago

Test name	Executions per second
Immer	11505.3 Ops/sec
Spread Operator	65513.2 Ops/sec
Ramda Lens	11693.1 Ops/sec

HTML Preparation code:

<script src="https://cdn.jsdelivr.net/npm/ramda@0.26.1/dist/ramda.min.js" integrity="sha256-43x9r7YRdZpZqTjDT5E0Vfrxn1ajIZLyYWtfAXsargA=" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/immer@4.0.1/dist/immer.umd.min.js"></script>

Script Preparation code:

var { compose, over, set, lensPath, append } = R

var INITIAL_DATA = { items: {}, count: 0, keys: [] }

for (var index = 0; index < 100; index++) {
  INITIAL_DATA[index] = { id: index, name: `ITEM-${index}`, value: Math.random() }
  INITIAL_DATA.count++
  INITIAL_DATA.keys.push(index)
}

var NEW_ITEM_ID = INITIAL_DATA.count +1

var produce = immer.default
immer.setAutoFreeze(false)

Tests:

Immer
data = produce(INITIAL_DATA, draft => { draft.items[NEW_ITEM_ID] = { id: NEW_ITEM_ID, name: 'ITEM-NEW', value: 0 } draft.counter++ draft.keys.push(NEW_ITEM_ID) })
Spread Operator
data = { ...INITIAL_DATA, items: { ...INITIAL_DATA.items, [NEW_ITEM_ID]: { id: NEW_ITEM_ID, name: 'ITEM-NEW', value: 0 } }, count: INITIAL_DATA.count +1, keys: [ ...INITIAL_DATA.keys, NEW_ITEM_ID] }
Ramda Lens
data = compose( over(lensPath(["keys"]), append(NEW_ITEM_ID)), over(lensPath(["count"]), x => x + 1), set(lensPath(["items", NEW_ITEM_ID]), { id: NEW_ITEM_ID, name: "ITEM-NEW", value: 0 }) )(INITIAL_DATA);

Run results for: State update

Immer

Spread Operator

Ramda Lens