



<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=uhhjlNf8Vw1G0SsjCNR5kDrchDwmF1nqr2pn9YS1pz0"></script>

    <span><script src='https://unpkg.com/deepmerge@4.0.0/dist/umd.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.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;:null,&quot;TestCases&quot;:[{&quot;Name&quot;:&quot;lodash merge&quot;,&quot;Code&quot;:&quot;var a = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022bla\u0022: true,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\nvar b = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\nvar c = _.merge(a, b);&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;object.assign&quot;,&quot;Code&quot;:&quot;var a = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022bla\u0022: true,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\nvar b = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\nvar c = deepmerge(a, b);&quot;,&quot;IsDeferred&quot;:false},{&quot;Name&quot;:&quot;spread&quot;,&quot;Code&quot;:&quot;var a = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022bla\u0022: true,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\nvar b = {\r\n  \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderWidth\u0022: \u00222px\u0022,\r\n  \u0022borderStyle\u0022: \u0022solid\u0022,\r\n  \u0022borderColor\u0022: \u0022transparent\u0022,\r\n  \u0022borderRadius\u0022: \u002250%\u0022,\r\n  \u0022height\u0022: \u00223.2rem\u0022,\r\n  \u0022minWidth\u0022: \u00223.2rem\u0022,\r\n  \u0022padding\u0022: \u00220\u0022,\r\n  \u0022color\u0022: \u0022#C8C6C4\u0022,\r\n  \u0022cursor\u0022: \u0022pointer\u0022,\r\n  \u0022:focus\u0022: {\r\n    \u0022outline\u0022: 0,\r\n    \u0022blaaaa\u0022: true\r\n  },\r\n  \u0022:hover\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  },\r\n  \u0022:focus-visible\u0022: {\r\n    \u0022color\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022backgroundColor\u0022: \u0022transparent\u0022,\r\n    \u0022borderColor\u0022: \u0022#A6A7DC\u0022,\r\n    \u0022\u0026 .ui-icon__filled\u0022: {\r\n      \u0022display\u0022: \u0022block\u0022\r\n    },\r\n    \u0022\u0026 .ui-icon__outline\u0022: {\r\n      \u0022display\u0022: \u0022none\u0022\r\n    }\r\n  }\r\n};\r\n/**\r\n * Simple object check.\r\n * @param item\r\n * @returns {boolean}\r\n */\r\nfunction isObject(item) {\r\n  return (item \u0026\u0026 typeof item === \u0027object\u0027 \u0026\u0026 !Array.isArray(item));\r\n}\r\n\r\n/**\r\n * Deep merge two objects.\r\n * @param target\r\n * @param ...sources\r\n */\r\nfunction mergeDeep(target, ...sources) {\r\n  if (!sources.length) return target;\r\n  const source = sources.shift();\r\n\r\n  if (isObject(target) \u0026\u0026 isObject(source)) {\r\n    for (const key in source) {\r\n      if (isObject(source[key])) {\r\n        if (!target[key]) Object.assign(target, { [key]: {} });\r\n        mergeDeep(target[key], source[key]);\r\n      } else {\r\n        Object.assign(target, { [key]: source[key] });\r\n      }\r\n    }\r\n  }\r\n\r\n  return mergeDeep(target, ...sources);\r\n}\r\nvar c = mergeDeep({}, a, b);&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>