import { useState, useEffect } from 'react'; export default function App() { console.log('1'); useEffect(() => { console.log('2'); }, []); return <Child />; } function Child() { console.log('3'); useEffect(() => { console.log('4'); }, []); return <div>Bcraft</div>; }

Pri izvršavanju ovog koda u konzoli, redoslijed izlaza će biti sljedeći:

1
3
2
4

Objašnjenje:

• Pri renderiranju komponente App, prvo se izvršava console.log('1').
• Zatim se renderira komponenta Child, gdje se poziva console.log('3').
• Nakon završetka renderiranja, React poziva efekte useEffect u redoslijedu njihove deklaracije, ali samo nakon montiranja komponenti.
• Prvo se izvršava efekt iz App (console.log('2')), zatim efekt iz Child (console.log('4')).

Tako, sinkroni logovi slijede redoslijed poziva funkcija, a efekti se izvršavaju nakon renderiranja, u redoslijedu njihove deklaracije.