title: Why useEffect doesn't call callback function if state doesn't change?
body: <p>I have the following code(react 16.8.6, react-dom: 16.8.6):</p>
  
  <pre><code>import React, { useState, useEffect, } from 'react';
  import ReactDOM from 'react-dom';
  
  function App(props) {
     const [counter, setCounter] = useState(0);
  
     console.log(1)
  
     useEffect(() =&gt; {
      console.log(2)
  
       setTimeout(() =&gt; {
         console.log(3)
  
         setCounter(1);
       }, 10000)
     });
  
     return  counter;
   }
  
  ReactDOM.render(&lt;App /&gt;, document.getElementById('root'));
  </code></pre>
  
  <p>When <code>App</code> component is rendered first time, it prints: </p>
  
  <blockquote>
    <p>1
    2</p>
  </blockquote>
  
  <p>After 10 seconds it prints:</p>
  
  <blockquote>
    <p>3, 1, 2</p>
  </blockquote>
  
  <p>Everything that was before is understandable for me, but now after 10 seconds it prints</p>
  
  <blockquote>
    <p>3, 1</p>
  </blockquote>
  
  <p>i.e. function that is passed to useEffect isn't called. I assume it's related to state somehow (as it doesn't change, if it changes useEffect works fine). Could you explain this behaviour?</p>