Execution order in React parent is rendered first children go next children's useEffect goes then then parent's useEffect can check in console
const Parent = ({ children }) => {
console.log(1)
useEffect(() => console.log(2), [])
return children
}
const Child = () => {
console.log(3)
useEffect(() => console.log(4), [])
return 'I am child'
}
<Parent>
<Child />
</Parent>
// 1 --> 3 --> 4 --> 2