title: Lazy initial state - What it is and how to use it?
body: <p>I am new to react Hooks. Am trying to make use of <code>useState</code> in my code. While I was using it I found a term &quot;Lazy initial state&quot;</p>
  <blockquote>
  <p><a href="https://reactjs.org/docs/hooks-reference.html#lazy-initial-state" rel="noreferrer">https://reactjs.org/docs/hooks-reference.html#lazy-initial-state</a></p>
  </blockquote>
  <pre><code>const [state, setState] = useState(() =&gt; {
    const initialState = someExpensiveComputation(props);
    return initialState;
  });
  </code></pre>
  <p>But I am not able to think of any use case where this lazy initialising of state will be useful.</p>
  <p>Like say my DOM is rendering and it needs the <code>state</code> value, but my <code>useState</code> has not initialised it yet! And say if you have rendered the DOM and the <code>someExpensiveComputation</code> has finished, the DOM will re-render!</p>