Using lazy initialization in React.useState https://reactjs.org/docs/hooks-reference.html#lazy-initial-state

lazy_initialization.js

/*
 * This example shows how using lazy initialization
 * in React.useState helps prevent unnecessary computation
 * Note: There are rare chances you'll need it.
*/
const Clock = () => {
  const [time, setTime] = useState(() => new Date()); // ✅ correct
  // const [time, setTime] = useState(() => 1000); // ❌ wrong and over-optimization

  useEffect(() => {
    const intervalId = setInterval(() => {
      setTime(new Date());
    }, 1000)

    return () => {
      clearInterval(intervalId);
    }
  }, [tickAmount]);

  return (<p>The time is {time.toLocaleTimeString()}.</p>);
}