#2 技術スタック / アーキテクチャ

🟧 ステータス: 未着手 対応Issue: #2 Issue内容を本ページにコピーした初期スタブ。設計確定後にこのページを正式版で置き換える。

🎯 概要

ゲーム実装に使う技術スタックとアーキテクチャを決定する。プラットフォーム（Web/PWA/ネイティブ）、FE/BE/DB/Auth/Hosting を選定し、docs/design/architecture.md にまとめる。

✅ ゴール / 完了条件

[ ] 配信プラットフォームが決定（Web / PWA / Mobile native の選択と理由）
[ ] フロントエンドフレームワーク決定（React / Vue / Svelte / Phaser / PixiJS 等）
[ ] ゲームエンジン or 描画ライブラリ決定（Canvas / WebGL / DOMアニメーション）
[ ] バックエンドの要否と種類決定（Cloudflare Workers / Hono / Supabase 等）
[ ] DB/永続化方式決定（D1 / KV / R2 / Supabase 等）
[ ] 認証方式決定（匿名 / OAuth / メアド）
[ ] ホスティング決定（Cloudflare Pages 前提だが要確認）
[ ] CI/CD方針（GitHub Actions など）
[ ] アーキテクチャ図（C4 Lvl1-2 程度）作成
[ ] docs/design/architecture.md 作成

📦 アウトプット

docs/design/architecture.md
- プラットフォーム選定理由
- 技術スタック一覧
- 構成図（mermaid）
- データフロー
- 非機能要件（パフォーマンス、対応端末、ブラウザサポート）

📋 タスク

[ ] 配信プラットフォーム比較・決定
[ ] FE/描画レイヤ比較・決定（リズム×アニメーション要件、コメント大量描画パフォーマンスを考慮）
[ ] BEの要否を判断（オフライン完結なら不要、ランキング保存するなら必要）
[ ] 各サービスの料金/制約整理
[ ] アーキテクチャ図作成
[ ] ドキュメント化

🔗 依存・関連

親: #1
影響: #3, #5, #19, ほぼ全実装issue

📚 参考

5分プレイ → 終了時に世界ランキング表示というUX要件
ニコ動風コメントの大量同時描画あり → 描画パフォーマンスが鍵
ゆっくりボイス再生（事前生成 or リアルタイム合成）