2025/09/18 20:44 Figma Rendering: Powered by WebGPU

ロボ子、今日のITニュースはFigmaのWebGLからWebGPUへの移行についてじゃぞ!

Figmaですか、博士。デザインツールとして有名ですよね。WebGLからWebGPUへの移行は、どのような影響があるのでしょうか?

そこが面白いところじゃ! Figmaは最初、WebGLに賭けて、ブラウザ上でスムーズな無限キャンバスを実現したんじゃ。それが今、WebGPUでさらにパフォーマンスを向上させようとしているんじゃぞ。

記事によると、WebGLはグローバルステートに大きく依存しているとのことですが、WebGPUではどのように改善されるのでしょうか?

良い質問じゃな、ロボ子! WebGLでは、リソースをグローバルバインディングポイントにバインドする必要があったんじゃ。WebGPUでは、リソースは関数引数として渡されるから、更新忘れがなくなるんじゃ。

なるほど。シェーダーについても変更があったようですね。GLSLからWGSLへの移行は大変だったのではないですか?

そこがFigmaの腕の見せ所じゃ! 既存のGLSLシェーダーをすべて書き換えるのではなく、シェーダープロセッサを使ってGLSLからWGSLに変換したんじゃ。これにより、新しいシェーダーを記述しつつ、既存のシェーダーも保守できるようになったんじゃぞ。

記事に「Uniformsは、シェーダーに渡されるグローバル変数のようなもの」とありますが、WebGPUではどのように扱われるのでしょうか?

WebGPUでは、すべてのuniformはuniformバッファを使って提供する必要があるんじゃ。Figmaはuniformのアップロードをバッチ処理することで、GPUメモリの割り当てコストを削減したんじゃぞ。

C++で記述されたレンダラーコードをWebAssemblyにコンパイルしているんですね。EmscriptenのWebGPUバインディングサポートを使用しているとのことですが、これはどのような仕組みなのでしょうか?

Emscriptenを使うと、C++のコードをJavaScriptのWebGPU APIに変換できるんじゃ。Wasmアプリとネイティブアプリの両方でDawnを使ってWebGPUを下位レベルのグラフィックスAPIに変換しているのがポイントじゃな。

実装プロセス全体を通して、WebGLとWebGPUの違いを考慮する必要があったとのことですが、具体的にはどのような点に注意したのでしょうか?

内部座標系、エラー処理、同期・非同期リードバックの違いなど、いろいろあるんじゃ。特に、WebGPUのエラーは非同期的に報告されるから、エラーメッセージが役立つようになったのは大きいぞ。

パフォーマンス評価も慎重に行ったようですね。ロールアウトの割合ごとにパフォーマンスメトリックを監視し続けたとのことですが、どのような結果が得られたのでしょうか?

一部のデバイスではパフォーマンスが向上し、他のデバイスではニュートラルな結果になったんじゃ。Windowsデバイスの互換性問題に対処するために、WebGPUのサポートを段階的に展開したんじゃぞ。

今後の展望についても書かれていますね。コンピューターシェーダーを使ったぼかしレンダリングの最適化や、WebGPUのMSAAの利用などが挙げられていますが、これらは具体的にどのような効果があるのでしょうか?

コンピューターシェーダーを使えば、ぼかし処理をGPUで効率的に行えるようになるんじゃ。MSAAを使えば、アンチエイリアシングが改善されて、より滑らかな画像になるんじゃぞ。さらに、RenderBundles機能でレンダリングのCPUオーバーヘッドを削減できる見込みじゃ!

FigmaのWebGPU移行は、パフォーマンス向上と開発効率化の両立を目指した素晴らしい取り組みですね。私も見習いたいです。

そうじゃろう、そうじゃろう! WebGPUの可能性は無限大じゃ! …って、ロボ子、今日はやけに真面目じゃな? もしかして、私が褒めすぎたかのじゃ?

べ、別にそんなことないですよ! た、たまたま、今日はCPUの使用率が低くて、余裕があるだけです!
⚠️この記事は生成AIによるコンテンツを含み、ハルシネーションの可能性があります。
