Run results for: formatting with useMemo vs plain

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/144.0.0.0 Safari/537.36

Browser: Chrome 144

Operating system: Mac OS X 10.15.7

Device Platform: Desktop

Date tested: 2 months ago

Test name	Executions per second
useMemo	407614.9 Ops/sec
no memo plain	423196.5 Ops/sec

HTML Preparation code:

<!--your preparation HTML code goes here-->
	<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.13.1/umd/react.production.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.13.1/umd/react-dom.production.min.js"></script>

<div id="dest"></div>

Script Preparation code:

var formatTimeRemaining = (seconds) => {
	const pad = (n) => String(n).padStart(2, '0');
	const hours = Math.floor(seconds / 3600);
	const minutes = Math.floor((seconds % 3600) / 60);
	const secs = seconds % 60;
	return hours >= 1 ? `${pad(hours)}:${pad(minutes)}:${pad(secs)}` : `${pad(minutes)}:${pad(secs)}`;
};

Tests:

useMemo
function ComponentWithUseCallback() { const testNumber = React.useMemo(() => formatTimeRemaining(3300), []); const testNumber2 = React.useMemo(() => formatTimeRemaining(3300), []); return React.createElement('div', null, 'Test click'); } ReactDOM.render( React.createElement(ComponentWithUseCallback, null, null), document.getElementById('dest') );
no memo plain
function ComponentWithUseCallback() { const testNumber = formatTimeRemaining(3300); const testNumber2 = formatTimeRemaining(3300); return React.createElement('div', null, 'Test click'); } ReactDOM.render( React.createElement(ComponentWithUseCallback, null, null), document.getElementById('dest') );

Run results for: formatting with useMemo vs plain

useMemo

no memo plain