Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
Immerjs vs lodash.merge
Go to the benchmark
Embed
Embed Benchmark Result
Run details:
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:121.0) Gecko/20100101 Firefox/121.0
Browser:
Firefox 121
Operating system:
Windows
Device Platform:
Desktop
Date tested:
2 years ago
Test name
Executions per second
Lodash freeze + merge
35582.5 Ops/sec
Immerjs state update
162523.3 Ops/sec
Immerjs without state change
511351.7 Ops/sec
Immerjs when we have pre-freezed state
172384.6 Ops/sec
HTML Preparation code:
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js'></script> <script src="https://unpkg.com/immer@6.0.3/dist/immer.umd.production.min.js"></script>
Script Preparation code:
var preFreezedState = Object.freeze({ "label": {"id":34,"title":"First label","data":{"dimension":{"height":2,"margin":{"bottom":0.1,"left":0.1,"right":0.1,"top":0.1},"width":3},"gridSize":0.05,"items":[{"format":{"align":"LEFT","size":9},"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.5104166666666666,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":12},"id":"52c5473c-0802-48c6-87b2-61919bb2370b","position":{"height":0.40625,"left":0.10416666666666667,"top":0.10416666666666667,"width":2.6770833333333335},"text":"MY FIRST LABEL","type":"STATIC_TEXT"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","position":{"height":1.7708333333333333,"left":2.3958333333333335,"top":0.10416666666666667,"width":0.5},"rotation":90,"type":"BAR_CODE"},{"format":{"align":"LEFT","size":9},"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","position":{"height":0.3541666666666667,"left":0.10416666666666667,"top":1.53125,"width":1.40625},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"fec7ea39-26d5-419b-ae00-67cfca3d244a","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.5104166666666666,"width":0.6875},"text":"Package","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"e0981542-f3f5-4634-94f4-afca2f5479b7","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.9270833333333334,"width":0.6979166666666666},"text":"Cost","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.9270833333333334,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"}],"meta":[{"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","value":"packageLabel"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","value":"receivedDate"},{"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","value":"receivedDate"},{"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","value":"costPerUnit"}],"unit":"in","version":1}} })
Tests:
Lodash freeze + merge
const likeReducerFn = (state) => { Object.freeze(state) const newState = _.merge({}, state); newState.label.id = 3 return newState } const state = { "label": {"id":34,"title":"First label","data":{"dimension":{"height":2,"margin":{"bottom":0.1,"left":0.1,"right":0.1,"top":0.1},"width":3},"gridSize":0.05,"items":[{"format":{"align":"LEFT","size":9},"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.5104166666666666,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":12},"id":"52c5473c-0802-48c6-87b2-61919bb2370b","position":{"height":0.40625,"left":0.10416666666666667,"top":0.10416666666666667,"width":2.6770833333333335},"text":"MY FIRST LABEL","type":"STATIC_TEXT"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","position":{"height":1.7708333333333333,"left":2.3958333333333335,"top":0.10416666666666667,"width":0.5},"rotation":90,"type":"BAR_CODE"},{"format":{"align":"LEFT","size":9},"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","position":{"height":0.3541666666666667,"left":0.10416666666666667,"top":1.53125,"width":1.40625},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"fec7ea39-26d5-419b-ae00-67cfca3d244a","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.5104166666666666,"width":0.6875},"text":"Package","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"e0981542-f3f5-4634-94f4-afca2f5479b7","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.9270833333333334,"width":0.6979166666666666},"text":"Cost","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.9270833333333334,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"}],"meta":[{"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","value":"packageLabel"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","value":"receivedDate"},{"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","value":"receivedDate"},{"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","value":"costPerUnit"}],"unit":"in","version":1}} } likeReducerFn(state)
Immerjs state update
const likeReducerFn = (state, draft) => immer.produce(state, draft => { draft.label.id = 3 }) const state = { "label": {"id":34,"title":"First label","data":{"dimension":{"height":2,"margin":{"bottom":0.1,"left":0.1,"right":0.1,"top":0.1},"width":3},"gridSize":0.05,"items":[{"format":{"align":"LEFT","size":9},"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.5104166666666666,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":12},"id":"52c5473c-0802-48c6-87b2-61919bb2370b","position":{"height":0.40625,"left":0.10416666666666667,"top":0.10416666666666667,"width":2.6770833333333335},"text":"MY FIRST LABEL","type":"STATIC_TEXT"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","position":{"height":1.7708333333333333,"left":2.3958333333333335,"top":0.10416666666666667,"width":0.5},"rotation":90,"type":"BAR_CODE"},{"format":{"align":"LEFT","size":9},"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","position":{"height":0.3541666666666667,"left":0.10416666666666667,"top":1.53125,"width":1.40625},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"fec7ea39-26d5-419b-ae00-67cfca3d244a","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.5104166666666666,"width":0.6875},"text":"Package","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"e0981542-f3f5-4634-94f4-afca2f5479b7","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.9270833333333334,"width":0.6979166666666666},"text":"Cost","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.9270833333333334,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"}],"meta":[{"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","value":"packageLabel"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","value":"receivedDate"},{"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","value":"receivedDate"},{"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","value":"costPerUnit"}],"unit":"in","version":1}} } likeReducerFn(state)
Immerjs without state change
const likeReducerFn = (state, draft) => immer.produce(state, draft => { }) const state = { "label": {"id":34,"title":"First label","data":{"dimension":{"height":2,"margin":{"bottom":0.1,"left":0.1,"right":0.1,"top":0.1},"width":3},"gridSize":0.05,"items":[{"format":{"align":"LEFT","size":9},"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.5104166666666666,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":12},"id":"52c5473c-0802-48c6-87b2-61919bb2370b","position":{"height":0.40625,"left":0.10416666666666667,"top":0.10416666666666667,"width":2.6770833333333335},"text":"MY FIRST LABEL","type":"STATIC_TEXT"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","position":{"height":1.7708333333333333,"left":2.3958333333333335,"top":0.10416666666666667,"width":0.5},"rotation":90,"type":"BAR_CODE"},{"format":{"align":"LEFT","size":9},"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","position":{"height":0.3541666666666667,"left":0.10416666666666667,"top":1.53125,"width":1.40625},"type":"DYNAMIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"fec7ea39-26d5-419b-ae00-67cfca3d244a","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.5104166666666666,"width":0.6875},"text":"Package","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"e0981542-f3f5-4634-94f4-afca2f5479b7","position":{"height":0.3958333333333333,"left":0.10416666666666667,"top":0.9270833333333334,"width":0.6979166666666666},"text":"Cost","type":"STATIC_TEXT"},{"format":{"align":"LEFT","size":9},"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","position":{"height":0.3958333333333333,"left":0.8020833333333334,"top":0.9270833333333334,"width":1.3958333333333333},"type":"DYNAMIC_TEXT"}],"meta":[{"id":"e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d","value":"packageLabel"},{"id":"c0cedbe6-2789-4c56-8a1f-47db275cad1f","value":"receivedDate"},{"id":"b039a74d-7c11-4f98-8d97-b1d69a8afa31","value":"receivedDate"},{"id":"4b07ab0f-412e-46a3-ba13-c8698b267264","value":"costPerUnit"}],"unit":"in","version":1}} } likeReducerFn(preFreezedState)
Immerjs when we have pre-freezed state
const likeReducerFn = (state, draft) => immer.produce(state, draft => { draft.label.id = 3 }) // as... state was freezed by previous reducer likeReducerFn(preFreezedState)