



<script src="/lib/lodash/dist/lodash.js"></script>
<script src="/lib/platform/platform.js"></script>
<script src="/lib/benchmark/benchmark.js"></script>
<script src="/js/testrunner.js?v=Rd75-VVkcFniJ1QX2nmMLEUUGEwdYLf0L4zaIB-OPUI"></script>

    <span><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></span>

<div id="validation-html-preparation"></div>

<script type="text/javascript">
    pageController = new TestRunnerController();
</script>
<textarea id="benchmark_definition_json" style="display:none">
    {&quot;ScriptPreparationCode&quot;:&quot;var preFreezedState = Object.freeze({\r\n\t\u0022label\u0022: {\u0022id\u0022:34,\u0022title\u0022:\u0022First label\u0022,\u0022data\u0022:{\u0022dimension\u0022:{\u0022height\u0022:2,\u0022margin\u0022:{\u0022bottom\u0022:0.1,\u0022left\u0022:0.1,\u0022right\u0022:0.1,\u0022top\u0022:0.1},\u0022width\u0022:3},\u0022gridSize\u0022:0.05,\u0022items\u0022:[{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:12},\u0022id\u0022:\u002252c5473c-0802-48c6-87b2-61919bb2370b\u0022,\u0022position\u0022:{\u0022height\u0022:0.40625,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:2.6770833333333335},\u0022text\u0022:\u0022MY FIRST LABEL\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022position\u0022:{\u0022height\u0022:1.7708333333333333,\u0022left\u0022:2.3958333333333335,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:0.5},\u0022rotation\u0022:90,\u0022type\u0022:\u0022BAR_CODE\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022position\u0022:{\u0022height\u0022:0.3541666666666667,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:1.53125,\u0022width\u0022:1.40625},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022fec7ea39-26d5-419b-ae00-67cfca3d244a\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:0.6875},\u0022text\u0022:\u0022Package\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e0981542-f3f5-4634-94f4-afca2f5479b7\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:0.6979166666666666},\u0022text\u0022:\u0022Cost\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022}],\u0022meta\u0022:[{\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022value\u0022:\u0022packageLabel\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022value\u0022:\u0022costPerUnit\u0022}],\u0022unit\u0022:\u0022in\u0022,\u0022version\u0022:1}}\r\n})\r\n&quot;,&quot;TestCases&quot;:[{&quot;Name&quot;:&quot;Lodash freeze \u002B merge&quot;,&quot;Code&quot;:&quot;const likeReducerFn = (state) =\u003E {\r\n  Object.freeze(state)\r\n  const newState = _.merge({}, state);\r\n  newState.label.id = 3\r\n  return newState\r\n}\r\n\r\nconst state = {\r\n\t\u0022label\u0022: {\u0022id\u0022:34,\u0022title\u0022:\u0022First label\u0022,\u0022data\u0022:{\u0022dimension\u0022:{\u0022height\u0022:2,\u0022margin\u0022:{\u0022bottom\u0022:0.1,\u0022left\u0022:0.1,\u0022right\u0022:0.1,\u0022top\u0022:0.1},\u0022width\u0022:3},\u0022gridSize\u0022:0.05,\u0022items\u0022:[{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:12},\u0022id\u0022:\u002252c5473c-0802-48c6-87b2-61919bb2370b\u0022,\u0022position\u0022:{\u0022height\u0022:0.40625,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:2.6770833333333335},\u0022text\u0022:\u0022MY FIRST LABEL\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022position\u0022:{\u0022height\u0022:1.7708333333333333,\u0022left\u0022:2.3958333333333335,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:0.5},\u0022rotation\u0022:90,\u0022type\u0022:\u0022BAR_CODE\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022position\u0022:{\u0022height\u0022:0.3541666666666667,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:1.53125,\u0022width\u0022:1.40625},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022fec7ea39-26d5-419b-ae00-67cfca3d244a\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:0.6875},\u0022text\u0022:\u0022Package\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e0981542-f3f5-4634-94f4-afca2f5479b7\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:0.6979166666666666},\u0022text\u0022:\u0022Cost\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022}],\u0022meta\u0022:[{\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022value\u0022:\u0022packageLabel\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022value\u0022:\u0022costPerUnit\u0022}],\u0022unit\u0022:\u0022in\u0022,\u0022version\u0022:1}}\r\n}\r\n\r\nlikeReducerFn(state)\r\n&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;Immerjs state update&quot;,&quot;Code&quot;:&quot;const likeReducerFn = (state, draft) =\u003E immer.produce(state, draft =\u003E {\r\n  draft.label.id = 3\r\n})\r\n\r\nconst state = {\r\n\t\u0022label\u0022: {\u0022id\u0022:34,\u0022title\u0022:\u0022First label\u0022,\u0022data\u0022:{\u0022dimension\u0022:{\u0022height\u0022:2,\u0022margin\u0022:{\u0022bottom\u0022:0.1,\u0022left\u0022:0.1,\u0022right\u0022:0.1,\u0022top\u0022:0.1},\u0022width\u0022:3},\u0022gridSize\u0022:0.05,\u0022items\u0022:[{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:12},\u0022id\u0022:\u002252c5473c-0802-48c6-87b2-61919bb2370b\u0022,\u0022position\u0022:{\u0022height\u0022:0.40625,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:2.6770833333333335},\u0022text\u0022:\u0022MY FIRST LABEL\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022position\u0022:{\u0022height\u0022:1.7708333333333333,\u0022left\u0022:2.3958333333333335,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:0.5},\u0022rotation\u0022:90,\u0022type\u0022:\u0022BAR_CODE\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022position\u0022:{\u0022height\u0022:0.3541666666666667,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:1.53125,\u0022width\u0022:1.40625},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022fec7ea39-26d5-419b-ae00-67cfca3d244a\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:0.6875},\u0022text\u0022:\u0022Package\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e0981542-f3f5-4634-94f4-afca2f5479b7\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:0.6979166666666666},\u0022text\u0022:\u0022Cost\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022}],\u0022meta\u0022:[{\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022value\u0022:\u0022packageLabel\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022value\u0022:\u0022costPerUnit\u0022}],\u0022unit\u0022:\u0022in\u0022,\u0022version\u0022:1}}\r\n}\r\n\r\nlikeReducerFn(state)&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;Immerjs without state change&quot;,&quot;Code&quot;:&quot;const likeReducerFn = (state, draft) =\u003E immer.produce(state, draft =\u003E {\r\n})\r\n\r\nconst state = {\r\n\t\u0022label\u0022: {\u0022id\u0022:34,\u0022title\u0022:\u0022First label\u0022,\u0022data\u0022:{\u0022dimension\u0022:{\u0022height\u0022:2,\u0022margin\u0022:{\u0022bottom\u0022:0.1,\u0022left\u0022:0.1,\u0022right\u0022:0.1,\u0022top\u0022:0.1},\u0022width\u0022:3},\u0022gridSize\u0022:0.05,\u0022items\u0022:[{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:12},\u0022id\u0022:\u002252c5473c-0802-48c6-87b2-61919bb2370b\u0022,\u0022position\u0022:{\u0022height\u0022:0.40625,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:2.6770833333333335},\u0022text\u0022:\u0022MY FIRST LABEL\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022position\u0022:{\u0022height\u0022:1.7708333333333333,\u0022left\u0022:2.3958333333333335,\u0022top\u0022:0.10416666666666667,\u0022width\u0022:0.5},\u0022rotation\u0022:90,\u0022type\u0022:\u0022BAR_CODE\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022position\u0022:{\u0022height\u0022:0.3541666666666667,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:1.53125,\u0022width\u0022:1.40625},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022fec7ea39-26d5-419b-ae00-67cfca3d244a\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.5104166666666666,\u0022width\u0022:0.6875},\u0022text\u0022:\u0022Package\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u0022e0981542-f3f5-4634-94f4-afca2f5479b7\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.10416666666666667,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:0.6979166666666666},\u0022text\u0022:\u0022Cost\u0022,\u0022type\u0022:\u0022STATIC_TEXT\u0022},{\u0022format\u0022:{\u0022align\u0022:\u0022LEFT\u0022,\u0022size\u0022:9},\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022position\u0022:{\u0022height\u0022:0.3958333333333333,\u0022left\u0022:0.8020833333333334,\u0022top\u0022:0.9270833333333334,\u0022width\u0022:1.3958333333333333},\u0022type\u0022:\u0022DYNAMIC_TEXT\u0022}],\u0022meta\u0022:[{\u0022id\u0022:\u0022e9b0ffbe-e383-4f53-ad16-cef1bcf3f67d\u0022,\u0022value\u0022:\u0022packageLabel\u0022},{\u0022id\u0022:\u0022c0cedbe6-2789-4c56-8a1f-47db275cad1f\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u0022b039a74d-7c11-4f98-8d97-b1d69a8afa31\u0022,\u0022value\u0022:\u0022receivedDate\u0022},{\u0022id\u0022:\u00224b07ab0f-412e-46a3-ba13-c8698b267264\u0022,\u0022value\u0022:\u0022costPerUnit\u0022}],\u0022unit\u0022:\u0022in\u0022,\u0022version\u0022:1}}\r\n}\r\n\r\nlikeReducerFn(preFreezedState)&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;Immerjs when we have pre-freezed state&quot;,&quot;Code&quot;:&quot;const likeReducerFn = (state, draft) =\u003E immer.produce(state, draft =\u003E {\r\n    draft.label.id = 3\r\n})\r\n\r\n// as... state was freezed by previous reducer\r\nlikeReducerFn(preFreezedState)&quot;,&quot;IsDeferred&quot;:false}]}
</textarea>

<form style="display:none;" id="autoreload_form" action="/Benchmarks/TestFrameForValidationWithHtmlPrepCode?autostart=1" method="post">
    <input type="hidden" name="htmlPrepCode" id="htmlPrepCode">
</form>