title: Triggering parent component's useEffect before child component's useEffect
body: <p>I am currently implementing metrics/analytics in a React application and I am trying to log pages in the order they are opened <a href="https://github.com/facebook/react/issues/15281" rel="nofollow noreferrer">(related)</a>. I have a certain page e.g ParentComponent and I have embedded there-in, child component e.g ChildComponent.</p>
  <pre><code>const ParentComponent = () =&gt; {
     // log page using useEffect
     return (&lt;ChildComponent /&gt;)
  }
  
  const ChildComponent = () =&gt; {
     // log page using useEffect
     // return something else 
  }
  </code></pre>
  <p>Both components have useEffects e.g</p>
  <pre><code>useEffect(() =&gt; {
     // log page e.g ParentComponent or ChildComponent.
  }, []);
  </code></pre>
  <p>However, I notice every-time that the child's useEffect is called before the parent's. My understanding is that this is understandable as the child is rendered fully before the parent is. But I please need to know if there are any ways of ensuring I can call functionality in the parent's first of all before calling functionality in the child's?</p>
  <p>Thanks.</p>