layout.tsx は、ページを移動したときどうなりますか。
再レンダリングされず、状態が保たれます。公式も「遷移時にレイアウトは状態を保持し、再レンダリングしない」と明記しています。サイドバーの開閉が戻らないのはこのためです。
面接官が見ているのはlayout の状態保持を知らないと、ヘッダーの挙動やデータ取得の置き場所を誤る。
よくある答えと、面談でどう見られるか
- 再レンダリングされず、状態が保たれる
公式の表現は「layouts preserve state, remain interactive, and do not rerender」です。 - ページごとに毎回作り直される
それは template.tsx の挙動です。layout は保たれます。 - 保たれるが、状態はリセットされる
状態も保たれます。サイドバーの開閉が遷移で戻らないのはこのためです。 - 状態が保たれる。毎回リセットしたい場合は template.tsx を使う
使い分けまで押さえられています。
模範解答
再レンダリングされず、状態が保たれたままになります。公式は「On navigation, layouts preserve state, remain interactive, and do not rerender」と書いています。サイドバーの開閉状態がページ遷移で戻らないのはこのためです。
毎回リセットしたい場合は template.tsx を使います。こちらは遷移のたびに新しいキーが与えられるので、配下の Client Component の状態がリセットされ、useEffect も再実行されます。
なお、ルートレイアウト(app/layout.tsx)は必須で、html と body のタグを含む必要があります。