Question

次のようなコードを書くと、レンダリングが何回行われるか。

const [state, setState] = useState();

console.log("Pichu");

if (state === undefined) {
  setState("Pikachu");
}

console.log("Raichu");

return <div>{state}</div>;

Answer

1回のみ。

ただしStrict modeかつ開発環境では2回

要素を返す前にstateを更新すると現在のレンダリングがスキップされ、再度レンダリングを行おうとするため。

https://beta.reactjs.org/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes