Vercel、AIグラフィックツール公開

シェーダーは、通常のWebチームにとって依然として最も出荷が難しいものです。WebGPUはハードウェアを提供しますが、1ピクセルも動く前に、アダプター、バインドグループレイアウト、パイプラインディスクリプターを渡します。Vercelはvercel.com上でシェーダーを構築するためにこのコストを社内で費やし、その結果をオープンソース化しました。vgpuは、.wgslファイルをインポート可能なモジュールとして扱い、1つのGpuコンテキストを公開し、同じシェーダーをブラウザのcanvas、ヘッドレスなNode.js、そしてCIのスナップショットテストで実行するTypeScriptライブラリです。デプロイ可能か？はい、vgpuはMITライセンスでnpmに公開されており、pnpm add vgpu が取得パスの全てです。これはライブラリであり、ホスト型サービスではないため、アカウント、クォータ、推論料金は発生しません。1つのコンテキスト、隠れたグローバルステートなし init() はアダプターとデバイスを取得し、単一のGpuハンドルを返します。その他すべてはそれに紐づいています。READMEにあるブラウザのクイックスタートは4行です:Copy Code Copied Use a different Browserconst gpu = await init();const surface = gpu.surface(canvas, { dpr: [1, 2] });const wave = gpu.effect(WAVE_WGSL, { set: { speed: 2 } });gpu.frame.loop(() => { wave.set({ time: gpu.time }); wave.draw(); });surface は canvas をラップし、デバイスピクセル比を1から2の間にクランプします。effect は WGSL をフルスクリーンエフェクトにコンパイルし、その uniform は set() を通じて WGSL 名でアドレス指定されます。フレームは明示的です。パス、クリア、描画は呼び出しであり、暗黙的なシーングラフの状態ではありません。モジュールシステムとしてのWGSL差別化要因はシェーダーのツールです。.wgslファイルはTypeScriptモジュールのようにインポートおよびエクスポートされます。vgpuはモジュールグラフを解決し、バインディングを反映し、未使用の宣言を削除し、ビルド時にコンパクトなシェーダーソースを出力します。これにより、通常シェーダーと同期がずれる手書きのバインディング宣言が不要になります。READMEには、完全なフルスクリーンエフェクトが25 KB (gzip圧縮時) で出荷され、その予算がCIで強制されると記載されています。3つのランタイム、1つのAPIこのパッケージは、vgpu、vgpu/node、vgpu/mock、vgpu/scene、vgpu/client、および vg のサブパスエクスポートを公開しています。