モジュールを分ける勘所

/mrsekut-p/関数は小さく作るだけでなく、フレームワーク特有の事情による「ここを分けると、複雑さを低減できる」という「勘所」があったりする

プリミティブ・汎用的なものは迷わず分けてしまって OK

言語によっては標準ライブラリに収録されるレベルの、汎用的な関数

shadcn/ui で作ったライブラリ（ボタン、ラジオボタン、スライダー等…）のように、汎用的な UI 部品

ただし、汎用的なので命名には気を使うこと

ドメイン知識を入れすぎない

標準ライブラリ・HTML 要素の属性名などに準拠する

<MyImageComp imageUrl={文字列} /> よりも <MyImageComp src={文字列} />のほうが良い

メンタルマッピング（脳内変換のための辞書）のコストを読者に押し付けないために

例えば、React だと、ステートの更新頻度やリセット等のライフサイクルの絡む場合が当てはまる

1. 【React】「困難は分割せよ」―― 複雑な画面は小さな機能に分けて実装しよう。

更新頻度

2. useState の初期値 ―― 変化する Props の値を固定する

ステートのリセット

3. React の Activity コンポーネント

「非表示の要素を、うまいこと休眠状態にする」機構

4. react-hook-form の Watch コンポーネント

render Props パターン

コンポーネントは再レンダリング発生の境界として機能するので、こちらを使うべき。

旧来の watch() は、「再レンダリングの境界」として機能しないので、利用しているコンポーネントそのものの再レンダリングを発生させる。