title: Prevent re-render while using custom hooks
body: <p>I'm experiencing something similar to this:
  <a href="https://stackoverflow.com/questions/56345853/should-custom-react-hooks-cause-re-renders-of-dependent-components">Should Custom React Hooks Cause Re-Renders of Dependent Components?</a></p>
  <p>So, I have something like this:</p>
  <pre><code>const ComponentA = props =&gt; {
    const returnedValue = useMyHook();
  }
  </code></pre>
  <p>And I know for a fact that <code>returnedValue</code> is not changing (prev. <code>returnedValue</code> is <code>===</code> to the re-rendered <code>returnedValue</code>), but the logic inside of the <code>useMyHook</code> does cause internal re-renders and as a result, I get a re-render in the <code>ComponentA</code> as well.</p>
  <p>I do realize that this is intentional behavior, but what are my <strong>best</strong> options here? I have full control over <code>useMyHook</code> and <code>returnedValue</code>. I tried everything as I see it, caching(with <code>useMemo</code> and <code>useCallback</code>) inside of <code>useMyHook</code> on returned value etc.</p>
  <p><strong>Update</strong></p>
  <p>Just to be more clear about what I'm trying to achieve:</p>
  <p>I want to use internal <code>useState</code> / <code>useEffect</code> etc inside of <code>useMyHook</code> and not cause re-render in the <code>ComponentA</code></p>