𝗪𝗲𝗯𝗚𝗣𝗨: 𝗯𝗿𝗮𝘂𝘀𝗲𝗿 𝗼𝗻 𝟮𝟱𝟬,𝟬𝟬𝟬 𝗽𝗮𝗿𝘁𝗶𝗰𝗹𝗲𝘀
本日で50日目となります。毎日新しい技術をゼロから構築していくこのシリーズも、今日が最終日です。最後はWebGPUで締めくくりたいと考えました。
ブラウザ内のGPUのみを使用して、25万個のパーティクルを完全にシミュレートしました。
CPUには少数の高速なコアがあります。一方、GPUには数千ものシンプルなコアがあります。CPUはパーティクルを一つずつ動かしますが、GPUは数千個を同時に動かすことができます。
WebGPUはWebGLの現代的な後継です。コンピュートシェーダーを通じて、ブラウザがハードウェアにアクセスすることを可能にします。これらのシェーダーにより、GPUは単にグラフィックスを描画するだけでなく、数学的な計算を行うことができます。
仕組み:
• GPUを管理するためのデバイスを作成します。 • 位置や速度などのパーティクルデータを保持するためのバッファを作成します。 • データを一度アップロードし、GPU上に保持し続けます。 • 1つのパーティクル用のコンピュートシェーダーを記述します。 • GPUがそのシェーダーを25万個すべてのパーティクルに対して一斉に実行します。
データはGPU上に保持されます。計算ステップからレンダリングステップへと、CPUに戻ることなく直接移動します。このスピードにより、シミュレーションを60fpsで実行することが可能です。
WebGPUは、ブラウザ内での数学計算やローカルな機械学習における新たな基盤です。このシリーズを締めくくるのにふさわしい技術でした。
この道のりを共に歩んでいただき、ありがとうございました。すべてのプロジェクトのアーカイブはこちらから確認できます。
ソースコード全文: https://github.com/dev48v/webgpu-from-zero
記事全文: https://dev.to/dev48v/webgpu-i-simulated-250000-particles-entirely-on-the-gpu-in-the-browser-2o0f
オプションの学習コミュニティ: https://dev48v.infy.uk/techfromzero.php