コンテンツにスキップ

Proposal

Why

メンバー一覧が長くなると、画面外の行まで同時に描画されることでスクロール時の負荷が増えます。content-visibility を活用して描画コストを抑え、一覧表示の体感性能を改善するために対応します。

What Changes

  • MemberList の各行に、画面外要素の描画を遅延できるスタイルを適用します。
  • content-visibility: autocontain-intrinsic-size を Tailwind 4 のカスタムユーティリティとして定義し、再利用可能にします。
  • 既存レイアウトを維持したまま、長いリストでのレンダリング性能を改善します。

Capabilities

New Capabilities

  • member-list-content-visibility: MemberList の行要素に対する描画最適化スタイルの適用要件を定義する。

Modified Capabilities

  • なし

Impact

  • 影響ファイル: src/components/MemberList.jsx, src/index.css
  • 影響範囲: メンバー一覧画面の描画挙動(機能仕様の追加)
  • 依存関係や外部 API への影響: なし