React useMemo (v5)

Revision 5 of this benchmark created on

Preparation HTML

<!-- Load React and ReactDOM from CDN -->
<script crossorigin src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script crossorigin src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>

<!-- Create a root div for React -->
<div id="root"></div>

Setup

Test runner

Ready to run.

Testing in
TestOps/sec
Without useMemo
const { useMemo, createElement } = React;

const App = () => {
  const value = new Array(10000).fill(1);
  return value.length;
};
ReactDOM.render(createElement(App), document.getElementById('root'));
ready
With useMemo
const { useMemo, createElement } = React;

const AppWithMemo = () => {
  const value = new Array(10000).fill(1);
  const total = useMemo(() => value.length, [value]);
  return total;
};
ReactDOM.render(createElement(AppWithMemo), document.getElementById('root'));
ready

Revisions

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