Dlaczego taka kolejność wykonywania useEffect()?

Czy może mi ktoś wyjaśnić czemu najpierw wykona się useEffect z ThirdComponentu, potem SecondComponentu i na koniec FirstComponentu ? Czy chodzi o to, że najpierw ThirdComponent będzie w pełni wyrenderowany, potem SecondComponent i FirstComponent ?

import { useEffect } from "react";

const SecondComponent = () => {
  console.log("Second  component");
  useEffect(() => {
    console.log("use Effect SecondComponent");
  });

  return <ThirdComponent></ThirdComponent>;
};

const ThirdComponent = () => {
  console.log("Third  component");
  useEffect(() => {
    console.log("use Effect ThirdComponent");
  });
};

const FirstComponent = () => {
  console.log("First  component");
  useEffect(() => {
    console.log("use Effect First component");
  });

  return <SecondComponent></SecondComponent>;
};

export default FirstComponent;

Tak.