React quiz - useEffect() hoisted

The running of useEffect() callback is determined by quite a few factors.

useEffect() hoisted (pass rate: 12%)react@18.3.1

{...}
import * as React from "react";
import { useState, useEffect, useLayoutEffect } from "react";
import { createRoot } from "react-dom/client";
function App() {
  const [state, setState] = useState(0);
  console.log(1);
  const start = Date.now();
  while (Date.now() - start < 50) {
    window.timestamp = Date.now();
  }
  useEffect(() => {
    console.log(2);
  }, [state]);
  Promise.resolve().then(() => {
    console.log(3);
  });
  setTimeout(() => {
    console.log(4);
  }, 0);
  useLayoutEffect(() => {
    console.log(5);
    setState((state) => state + 1);
  }, []);
  return null;
}
const root = createRoot(document.getElementById("root"));
root.render(<App />);

{...}
import * as React from "react";
import { useState, useEffect, useLayoutEffect } from "react";
import { createRoot } from "react-dom/client";
function App() {
  const [state, setState] = useState(0);
  console.log(1);
  const start = Date.now();
  while (Date.now() - start < 50) {
    window.timestamp = Date.now();
  }
  useEffect(() => {
    console.log(2);
  }, [state]);
  Promise.resolve().then(() => {
    console.log(3);
  });
  setTimeout(() => {
    console.log(4);
  }, 0);
  useLayoutEffect(() => {
    console.log(5);
    setState((state) => state + 1);
  }, []);
  return null;
}
const root = createRoot(document.getElementById("root"));
root.render(<App />);

What gets logged in order?

click on the console.log lines to input your answer.