'use client' を付けたファイルが import しているユーティリティ関数は、クライアントに送られますか。
送られます。しかも推移的です。公式は use client がモジュール依存グラフに境界を導入し、クライアントモジュールのサブツリーを作ると説明しています。import した先まで含みます。
面接官が見ているのは境界がモジュール依存グラフに効くことを理解しているか。
これは「参画したプロジェクトで、ほぼ全部のファイルの先頭に 'use client' が付いていました。どう判断しますか。」への追撃質問です。
よくある答えと、面談でどう見られるか
- 送られる。import しているものは推移的にクライアントバンドルに含まれる
その通りです。境界より下は、自分が 'use client' を書いていなくてもクライアント扱いになります。 - 送られない。'use client' を書いたファイルだけがクライアント扱いになる
逆です。公式は「そのモジュールと、import しているもの・直接レンダリングしているものがまとめてクライアントバンドルに含まれる」と書いています。だからこそ境界の位置が効きます。 - 実際に使われている関数だけが送られる
未使用コードの削除は働きますが、それは境界の話とは別の最適化です。使っている以上は入りますし、そのライブラリが引きずる依存も一緒に入ります。 - サーバー側でも実行されるので、両方に含まれる
両方で評価され得るのは事実です。公式も「サーバーコードから import されればサーバーで、クライアントコードから import されればクライアントで評価される」と書いています。ただし設問の要点は「クライアントに送られるか」で、答えは送られる、です。
面接官は何を見ているか
- 送られる（バンドルに含まれる）と答えた
- 依存が推移的に巻き込まれると説明できた
- だから境界を下げる意味がある、と繋げられた
模範解答
送られます。しかも推移的に巻き込まれます。
React の公式リファレンスは、'use client' が「モジュール依存グラフ上にサーバーとクライアントの境界を導入し、クライアントモジュールのサブツリーを作る」と説明しています。境界より下のモジュールは、自分が 'use client' を書いていなくてもクライアント扱いになります。
だから「この util には 'use client' を書いていないからサーバーだけで動く」は成り立ちません。重い日付ライブラリを1つ import しているだけで、それがバンドルに乗ります。
同じモジュールがサーバー側から import されればサーバーで、クライアント側から import されればクライアントで評価される、という二面性もあります。「このファイルはどっちで動くか」はファイル単体では決まらず、どこから import されたかで決まります。
ここからどう深掘りされるか
この問いに答えられた場合、面談は次の質問に進みます。