B-159調査: ツール・チートシートのダイナミックインポート構造の調査

B-159「ツールとチートシートのダイナミックインポート廃止・静的化」の調査依頼です。

背景

ownerから、ツール（/tools）とチートシート（/cheatsheets）の個別ページがコンテンツを動的に読み込んでおり、読み込み時間の伸びによるUX悪化が指摘されています。 これらは本来静的なコンテンツなので、動的インポートを廃止して静的に取り込むべきです。 根本的なアーキテクチャ変更も選択肢に含めて、最善の方法を探ってほしいとのことです。

調査してほしいこと

1. 現状の構造の把握

   • /tools と /cheatsheets のルーティング構造（app/配下のディレクトリ・ページ構成）
   • 個別ページがどのようにコンテンツコンポーネントを読み込んでいるか（dynamic import, next/dynamic等）
   • ツール・チートシートのレジストリ/メタデータ管理の仕組み
   • 各ツール・チートシートのコンポーネントがどこに定義されているか

2. 問題点の特定

   • 動的インポートが使われている具体的な箇所（ファイルパス、行番号）
   • 動的インポートによって生じているUX上の問題（ローディング状態、レイアウトシフト等）
   • 現在のアーキテクチャの制約や課題

3. Next.js App Routerでの静的化のベストプラクティス

   • generateStaticParams を使った静的生成
   • 動的インポートを使わずにコンポーネントを静的に取り込む方法
   • ビルド時のバンドルサイズへの影響と対策
   • 既存のテストへの影響

成果物

• 現状のアーキテクチャ図（ディレクトリ構造、データフロー）
• 動的インポートが使われている全箇所のリスト
• 静的化のアプローチの選択肢（メリット・デメリット付き）
• 推奨アプローチとその理由