![[Astro #85] R3F WITManager リファクタリング & ハードコード地雷除去で2面完成](https://assets.lain-lab.com/images/uploads/astro-85-r3f-wit-manager-refactoring-hardcoded-magic-numbers.webp)
[Astro #85] R3F WITManager リファクタリング & ハードコード地雷除去で2面完成
React Three Fiber 横スクロールシューティングの設計負債清算記録。巨大な useFrame の分割、敵パターンのデータ駆動化、座標オフセット問題の根本解決、プロシージャル背景のテーマ化、ステージ遷移ロジックなど、ゲーム完成までの実装過程を詳述。
ARCHIVE_INDEX / PAGE_4
TOTAL_ITEMS: 700
![[Astro #84] WITコアエンジンにおける二重ループ内探索の全廃とスポーン時パラメータ焼き付けによるランタイムクラッシュの根本解決](https://assets.lain-lab.com/images/uploads/astro-84-r3f-wit-manager-optimization-spawn-time-parameter-baking.webp)
[Astro #84] WITコアエンジンにおける二重ループ内探索の全廃とスポーン時パラメータ焼き付けによるランタイムクラッシュの根本解決
WITコアエンジンのメインループ最深部で発生していた設定データの動的ルックアップを撤廃し、生成時に判定半径やオフセットを固着させる方式へ移行。型キャストを排除し、処理負荷低減と堅牢性を両立したリファクタリングの事実をまとめています。
![[Astro #83] 3Dエンディングシーケンス実装、連動型観覧車弾幕の最適化、そして自機の床隙間ハマり・すり抜けバグの完全根絶](https://assets.lain-lab.com/images/uploads/astro-83-r3f-3d-ending-sequence-interlocked-carousel-bullet-walls-and-ghost-collider-subversion.webp)
[Astro #83] 3Dエンディングシーケンス実装、連動型観覧車弾幕の最適化、そして自機の床隙間ハマり・すり抜けバグの完全根絶
React Three Fiber（R3F）によるSTG開発。SkeletonUtils.cloneを活用したVRAM保護型クレジットインフラの構築、キャッシュ汚染のない親子ノード傾転による大観覧車ロールAIの設計、そしてWITController内の床名前検閲仕様を暴き、5重のゴーストコライダーへのID偽装によって床の微小な隙間ハマりを永久根絶した高精度物理ハックを詳解。
![[Astro #82] React Three Fiberによるデータ駆動型マルチステージ構築とシステム堅牢化ハック](https://assets.lain-lab.com/images/uploads/astro-82-r3f-data-driven-multi-stage-enemy-ai-and-audio-cleanup.webp?)
[Astro #82] React Three Fiberによるデータ駆動型マルチステージ構築とシステム堅牢化ハック
React Three Fiber（R3F）環境下での3Dシューティングゲーム開発記録。動的データ駆動によるマルチステージ遷移、武器ステートの排他制御、およびSPA遷移時のオーディオ残存バグの解決法を実装ベースで記述します。
![[Astro #81] 3Dシューティングにおける被弾判定・シールド装甲剥離・ゲームオーバーシーケンスとHMRライフサイクル問題の解決](https://assets.lain-lab.com/images/uploads/astro-81-threejs-r3f-hit-detection-shield-break-and-hmr-lifecycle-resolution.webp)
[Astro #81] 3Dシューティングにおける被弾判定・シールド装甲剥離・ゲームオーバーシーケンスとHMRライフサイクル問題の解決
React Three FiberとViteを組み合わせた3Dシューティングゲーム開発における、物理判定の厳密化、装甲破壊の視覚フィードバック、およびホットリロード時のガベージコレクション不整合対策について解説します。
![[Astro #80] Three.jsにおける3Dアセット最適化、地上敵AIの動的地形追従、およびWebXRのAボタン拡張](https://assets.lain-lab.com/images/uploads/astro-80-threejs-asset-optimization-dacker-terrain-following-and-webxr-gamepad.webp)
[Astro #80] Three.jsにおける3Dアセット最適化、地上敵AIの動的地形追従、およびWebXRのAボタン拡張
WebGLおよびWebXRシューティングゲームの描画負荷を削減するため、Blenderによる複数パーツの1オブジェクト結合（ドローコール削減）と10分の1デシメートを実施。さらに、画面両端のマスコットアバターのボーン演算を最初の1フレームで固定するフリーズハックを導入し、毎フレームのスキニング負荷を完全に排除しました。本記事では、ソリッドな地形ブロックをリアルタイムに走査して自動昇降する地上敵ダッカー型AIの実装、ゲーム全体の敵弾速を一元管理するグローバルパラメータの設計、およびWebXR Gamepad APIを使用したAボタンでのパワーアップ発動とチャタリング防衛Refの配線について解説します。
![[Astro #79] Three.jsで実装する軽量な地形這行ミサイル物理と多段階パワーアップインフラ](https://assets.lain-lab.com/images/uploads/astro-79-threejs-lightweight-terrain-following-missile-physics-and-multi-stage-power-up.webp)
[Astro #79] Three.jsで実装する軽量な地形這行ミサイル物理と多段階パワーアップインフラ
WebGLシューティングゲームにおける、軽量な地形這行ミサイル（FALL/SLIDE/CLIMB）のステートマシン物理と、グラディウス準拠の2段階パワーアップ（同時連射・上限MAX時のUI非表示および自動スキップ機能）、地形の継ぎ目対策やチャタリングを防ぐ自爆処理の最適化手法をまとめました。
![[Astro #78] Three.jsで創る電脳魔女STG：動的クレジット案内板・プロシージャル床・星ハート爆散物理の実装](https://assets.lain-lab.com/images/uploads/astro-78-threejs-cyber-witch-stg-credit-board-procedural-floor-and-particle-burst.webp)
[Astro #78] Three.jsで創る電脳魔女STG：動的クレジット案内板・プロシージャル床・星ハート爆散物理の実装
Three.jsとReact Three Fiberを用いたSTG開発において、データ駆動型の動的クレジット看板、プロシージャルな千鳥貼りフローリング床、自機と障害物の衝突クランプ物理、および星型・ハート型の高輝度爆散パーティクルシステムを実装したプロセスを技術的に詳述します。
![[Astro #77] Three.jsで創る電脳魔女STG：プロシージャル夜空背景のコンポーネント化とマスコットのライティング制御](https://assets.lain-lab.com/images/uploads/astro-77-threejs-cyber-witch-stg-procedural-backdrop-and-mascot-lighting.webp)
[Astro #77] Three.jsで創る電脳魔女STG：プロシージャル夜空背景のコンポーネント化とマスコットのライティング制御
Three.js（React Three Fiber）を用いたSTG開発記第77弾。劇場の床の拡張から、SystemAssets.jsonによるライセンス管理インフラの構築、数式（サイン波・モジュロ）を用いた完全シームレスな夜空背景のプロシージャル生成と別ファイルへの外出しリファクタリングまでを徹底解説。
![[Astro #76] Three.jsで作るサイバー魔女STG：データ駆動型タイムラインと音響インフラの完全移行](https://assets.lain-lab.com/images/uploads/astro-76-threejs-cyber-witch-stg-data-driven-timeline-and-audio-infrastructure.webp)
[Astro #76] Three.jsで作るサイバー魔女STG：データ駆動型タイムラインと音響インフラの完全移行
React Three Fiber環境下でのSTGエンジン構築。リプルレーザーの描画最適化から始まり、Z字型クランク編隊の数学的実装、Stage1.jsonによるタイムライン制御、Rキーリセットにおける時間軸バグの克服、そしてWebAudioベースのAudioControllerによる遅延ゼロ連射SEの実装までをロジカルに解説します。
![[Astro #75] three-mesh-bvhでハイポリ地形のレイキャスト問題を根絶。テストコード混入バグとボスイベント欠落の修正](https://assets.lain-lab.com/images/uploads/astro-75-three-mesh-bvh-raycaster-fix-and-bug-fixes.webp)
[Astro #75] three-mesh-bvhでハイポリ地形のレイキャスト問題を根絶。テストコード混入バグとボスイベント欠落の修正
Three.js / React Three Fiber環境におけるMeshBVH（境界ボリューム階層）の導入によるレイキャスト高速化、ENEMY_BUNYAテストコード混入によるエンディング誤起動バグ、BOSS_HACKLOAD接触イベント欠落、箒モードの移動速度逆転バグの修正内容を解説。
![[Astro #74] RPG完成。ラスボス暗黒魔法エフェクトとネオングローダメージポップアップの実装](https://assets.lain-lab.com/images/uploads/astro-74-final-boss-dark-magic-and-glow-damage-popup-implementation.webp)
[Astro #74] RPG完成。ラスボス暗黒魔法エフェクトとネオングローダメージポップアップの実装
Three.jsおよびReact Three Fiber環境下における、ラスボス戦の演出強化ハック。人魂の高速公転収束、AnimationMixerの単発再生制御、高解像度発光文字ビルボード、depthTest無効化による最前面描画、CameraHUDを用いた正面ロック防衛インフラの実装内容を解説。