/memory-makers を「メモリーメーカー一覧」から「半導体サプライチェーン動向」に作り変えた1日の記録。Foxconn の月次売上カードを足したら、ネットワーク陣営の月次売上ページが要るとなり、最後に DRAM 分類マトリックスまで作った。NVIDIA陣営 vs Broadcom陣営のスケールアウト/スケールアップ構造を月次売上で観測する基盤になる。

何を作ったか

朝の Foxconn 1社追加から始まり、夕方には DRAM 分類マトリックスまで広がった。

• Foxconn 月次売上カード: バーチャート（月次売上、億NT$）＋折れ線（前年同月比YoY%）。24ヶ月分。
• ネットワーク陣営の月次売上ページ: Foxconn(2317) / Wistron(3231) / Quanta(2382) / Wiwynn(6669) / Accton(2345) の5社。
• Nanya Technology(2408) の追加: 汎用DRAM専業の台湾メーカー。あわせて Winbond(2344) と PSMC(6770) も入れた。
• DRAM分類マトリックス: /memory-makers/dram-taxonomy 配下に、4ファミリー（汎用/グラフィックス/モバイル/HBM）× 世代の格子図、バブル分布、ツリー、表の4種類。

データは既存の Turso tw-monthly-revenue.db（FinMind 由来）にすべて揃っていたので、新規取得は不要。generate-tw-monthly-revenue.mjs で TS データを再生成 → makers.ts / registry.ts / index.ts の3箇所に登録するだけで1社追加できる構成になった。

なぜそうしたか

きっかけは光通信記事の流れで「Foxconn の月次売上を見ると NVIDIA の出荷タイミングが読める」と気づいたこと。途中で「Accton は完全に Broadcom 陣営」「NVIDIA はラック内のスケールアップ層、Broadcom はラック間のスケールアウト層、階層が違う」とファクトチェックで自分の認識が誤っていたことが判明し、月次売上を陣営別に並べる意味がはっきりした。

• スケールアップ層（ラック内 NVLink）: NVIDIA Spectrum-X / Quantum InfiniBand。組み立てる Foxconn / Wistron / Quanta / Wiwynn の月次が出荷の先行指標になる。
• スケールアウト層（ラック間 Ethernet）: Broadcom Tomahawk / Jericho。スイッチを作る Accton の月次が陣営の伸びを映す。
• DRAM 層: Samsung / SK Hynix / Micron は四半期、Nanya / Winbond / PSMC は 翌月3〜9日に月次開示。Nanya は業界最速（翌月3〜5日）で、汎用DRAM需給の先行シグナルになる。

NVIDIA だけ持っていれば足りる時代は終わり、陣営の構造を月次で見続けるためのページに作り変えた。

どう試行錯誤したか

形にする過程で4回詰まって、4回直した。

1. バーチャートの max 値が大きすぎて変化が見えなかった

最初のチャートは Accton や Wiwynn の Y軸が 1000 まで伸びていて、実値が 274 程度しかない月の棒がほんの少ししか立たない。月次の変化が目で追えなかった。

monthlyRevenue.ts の revenueAxisTop を「実値の最大 × 1.15 を nice 値に丸める」純粋関数に書き直した。

// 純粋関数で Y 軸上限を計算
export const calcRevenueAxisTop = (max: number): number => {
  const padded = max * 1.15
  const order = Math.pow(10, Math.floor(Math.log10(padded)))
  return Math.ceil(padded / (order / 2)) * (order / 2)
}

これで Accton なら Y軸が 1000 → 400 まで詰まり、月次の凹凸が読めるようになった。

2. マゼンタの折れ線が背景と重なって数字が読めなかった

YoY折れ線をアクセントカラーのマゼンタ（#d6336c 系）で描いていたが、バーチャートと重なる部分で数字ラベルが滲んで読めない。SVGダイアグラムスキルのグレー8段階に合わせて配色を統一した。

• バー: 薄いグレー（gray-300 系）
• YoY折れ線: 濃いグレー（gray-700 系）
• 数字ラベル: 黒

色情報を減らしたら、形状の違いだけで意味が伝わるようになった。

3. それでも重なって見づらかった → チャートを上下に分割した

濃淡を整えても、棒とラインを同じ SVG に重ねる以上、数字の被りは消えない。「チャートを2つに分けましょう。上がバー、下が折れ線」とユーザーから提案があって、MonthlyRevenueChart.vue を上下2段構成に書き直した。バーチャートに割ける高さも増えて、変化がはっきり見えるようになった。

ついでに12月と1月の間に縦点線を入れて年度境界を明示。前年同月比を眼で追うときに区切りが要る、という指摘で気づいた細部だった。

4. 矢印キーで隣の銘柄に移動するショートカット

メーカーが7社、市場系ページが3〜4枚と増えてきたら、index に戻って次の銘柄を開くのが面倒になった。MakerPagination.vue を作って ← / → で隣のページに飛べるようにした。use-memory-maker-nav composable がページ順を一元管理して、4ページに同じコンポーネントを差し込むだけで動く。

Nanya の5月分が取れなかった話

Nanya を追加した直後、ユーザーから「5月分発表あるらしい」と聞いて FinMind を叩いたら、Foxconn(2317) の 2026-05 はまだ FinMind に入っていない（最新 2026-04, create_time 2026-05-06）。一方 Nanya(2408) は 2026-05 が既に入っていた（create_time 2026-06-03）。

FinMind は台湾各社の IR 発表から1〜数日のタイムラグで取り込んでいて、銘柄ごとに開示日が違う。

• Nanya(2408): 翌月3〜5日（業界最速）
• Foxconn(2317): 翌月6日前後
• Winbond(2344) / PSMC(6770): 翌月8〜9日

このタイミングのズレを毎日キャッチアップしたいので、/update-tw-monthly-revenue スラッシュコマンドを作って /make-diary の末尾ステップに組み込んだ。毎朝の日記生成パイプラインの中で、変更があった銘柄だけ更新する。5月分が揃わなかった残りの銘柄は翌日以降に持ち越し、自動で取り込まれる。

DRAM分類マトリックスの追加

夕方に「汎用DRAM、HBM、DDR が階層的に分かれる構造を1枚で俯瞰したい」と要望が来て、/memory-makers/dram-taxonomy を新設した。

4ファミリー × 5世代のマトリックス、ファミリー別バブル分布、世代ツリー、規格名と用途の表の4種類を1ページに並べた。current 世代をファミリー色でハイライトし、next 世代を薄色で示すことで、「今どこにいて次に何が来るか」が一目で見える。

実装の最後でテストが落ちて、memoryMakerNav.test.ts が市場ページ3件を順序固定で検証していたことに気づいた。Codex レビューで事前に指摘されていた箇所で、4件前提に書き直したら通った。

学び

形容詞でなく動詞で残す。

• AIに任せても画面で違和感を拾うのは人間係: バーチャートの max が 1000 で実値が 274 のとき、数字としては正しいが目で見て凹凸が読めない。これは Claude Code には分からない。画面を出して人間が「変化が見えない」と言うまで、コードは正しく動いているように見える。
• 色情報を減らすと形状が語り出す: マゼンタを外してグレー濃淡に揃えただけで、バーと折れ線の意味の違いが形だけで伝わるようになった。SVG ダイアグラムスキルのグレー8段階は強い。
• データ取得のタイムラグは銘柄ごとに違う: Nanya は翌月3日、Foxconn は翌月6日と、台湾各社の IR 開示パターンを DB から自動集計するワークフローに組み込んだ。1日の差が先行指標としての価値を決める。
• 1社追加が3ファイル編集で済む構造: makers.ts / registry.ts / index.ts の3点に登録するだけで、データ生成からチャート描画、パンくず、ページネーションまで自動で繋がる。追加コストを 30 分に圧縮できたのが、Nanya → Winbond → PSMC と一気に広げられた理由。

明日以降、Foxconn / Wistron / Quanta / Wiwynn の 2026-05 分が FinMind に入ったら、/update-tw-monthly-revenue が拾って自動更新する。それを /make-diary の中で毎朝確認する流れに乗せた。