immutable.js redux state set vs merge

Benchmark created on


Preparation HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/immutable/3.8.1/immutable.min.js"></script>

Setup

const INITIAL_STATE = Immutable.fromJS({
    count: 0,
    isLoading: false,
    items: Immutable.Map(),
    itemIds: Immutable.Set()
  });
  
  const state = INITIAL_STATE;
  
  const items = Immutable.fromJS({
    '1': { 'id': '1', data: 'hello_world' }
  });
  
  const itemIds = Immutable.fromJS([
    '1', '2', '3', '4'
  ]);

Test runner

Ready to run.

Testing in
TestOps/sec
set
state
  .set('count', state.get('count') + 1)
  .set('isLoading', !state.get('isLoading'))
  .set('items', items)
  .set('itemIds', itemIds)
ready
merge
state.merge({
  'count': (state.get('count') + 1),
  'isLoading': !state.get('isLoading'),
  'items': items,
  'itemIds': itemIds
});
ready
withMutations set
state.withMutations((map) => {
  map
    .set('count', map.get('count') + 1)
    .set('isLoading', !map.get('isLoading'))
    .set('items', items)
    .set('itemIds', itemIds);
});
ready
withMutations merge
state.withMutations((map) => {
  map.merge({
    'count': (map.get('count') + 1),
    'isLoading': !map.get('isLoading'),
    'items': items,
    'itemIds': itemIds
  });
});
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.