CHAPTER 06 · WEBGPU / WGSL / COMPUTE SHADER
一本ずつのレイを、GPUで並列に。
第5章の解析的な交差判定をWGSLのCompute Shaderへ移し、反射や影のための二次レイまで追跡する。物体と交差する計算をGPUの各スレッドで実行します。
LIVE · WEBGPU COMPUTEscript-start
WebGPUを初期化しています…
アダプターの情報を確認中
GPU処理の完了待ち時間を表示します
操作
WebGPUが使えない端末では、その理由を表示します。Canvas 2Dへの無言のフォールバックは行いません。
各画素をGPUのスレッドに
8×8スレッドを1ワークグループとして起動し、球2個と床との交差を計算。最短の正の距離から法線と色を求めます。
影と反射もレイで調べる
「影」をONにすると光源方向への遮蔽検査を追加。反射回数を増やすと反射方向に次のレイを飛ばします。
計算と画面表示は別
Compute Shaderで rgba8unorm のGPUテクスチャに書き込み、画面表示は専用の頂点・フラグメントシェーダーに渡します。
レイトレーシングの種類に注意
この教材はCompute Shaderによるソフトウェア交差判定です。専用のハードウェアRTパイプラインやBVHを使う実装ではありません。また確率的なパストレーシングでもなく、球と平面に限った鏡面反射の練習用実装です。