このページは Cloud Translation API によって翻訳されました。

WebGPU の新機能（Chrome 119）

François Beaufort

フィルタ可能な 32 ビット浮動小数点テクスチャ

32 ビットの浮動小数点テクスチャは、HDR 画像や深度マップなどの高精度データを保存するために使用されます。特に、ハイエンドのゲームやプロフェッショナルアプリケーションで使用される GPU にとって重要です。

フィルタ可能な 32 ビット浮動小数点テクスチャのサポートは、32 ビット浮動小数点テクスチャをフィルタする GPU の機能について説明しています。つまり、GPU で浮動小数点テクスチャのエッジが滑らかになり、ギザギザが軽減されます。これは、WebGL の「OES_texture_float_linear」拡張機能に似ています。

すべての GPU がフィルタ可能な 32 ビット浮動小数点テクスチャをサポートしているわけではありません。GPUAdapter で "float32-filterable" 機能を使用できる場合は、この機能を使用して GPUDevice をリクエストし、「r32float」、「rg32float」、「rgba32float」形式でテクスチャをフィルタリングできるようになりました。次の例と問題 dawn:1664 をご覧ください。

const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("float32-filterable")) {
  throw new Error("Filterable 32-bit float textures support is not available");
}
// Explicitly request filterable 32-bit float textures support.
const device = await adapter.requestDevice({
  requiredFeatures: ["float32-filterable"],
});

// Create a sampler with linear filtering.
const sampler = device.createSampler({
  magFilter: "linear",
});

// Create a texture with rgba32float format.
const texture = device.createTexture({
  size: [100, 100],
  format: "rgba32float",
  usage: GPUTextureUsage.COPY_DST | GPUTextureUsage.TEXTURE_BINDING,
});

// Write data to texture, create a bindgroup with sampler and texture and
// send the appropriate commands to the GPU....

unorm10-10-10-2 頂点形式

WebGPU 仕様に、新しい頂点形式「unorm10-10-10-2」（別名「rgb10a2」）が追加されました。1 つの 32 ビット値と 4 つの正規化された符号なし整数値で構成され、10 ビット、10 ビット、10 ビット、2 ビットとして配置されます。次の例と問題 dawn:2044 をご覧ください。

// Define the layout of vertex attribute data with unorm10-10-10-2 format.
const buffers = [
  {
    arrayStride: 0,
    attributes: [
      { format: "unorm10-10-10-2", offset: 0, shaderLocation: 0 },
    ],
  },
];

// Describe the vertex shader entry point and its input buffer layouts.
const vertex = {
  module: myVertexShaderModule,
  entryPoint: "main",
  buffers,
};

// Pass vertex to device.createRenderPipeline() and
// use vec4<f32> type in WGSL shader code to manipulate data.

rgb10a2uint テクスチャ形式

WebGPU 仕様に「rgb10a2uint」という新しいテクスチャ形式が追加されました。これは、10 ビットの赤、10 ビットの緑、10 ビットの青、2 ビットのアルファの 4 つの符号なし整数コンポーネントを持つ 32 ビットの圧縮ピクセル形式で構成されています。次の例と問題 dawn:1936 をご覧ください。

// Create a texture with rgb10a2uint format.
const texture = device.createTexture({
  size: [100, 100],
  format: "rgb10a2uint",
  usage: GPUTextureUsage.COPY_DST | GPUTextureUsage.TEXTURE_BINDING,
});

// Write data to texture, create a bindgroup with texture and
// send the appropriate commands to the GPU....

Dawn の更新

タイムスタンプクエリを使用すると、WebGPU アプリケーションは GPU コマンドの実行にかかる時間をナノ秒単位で正確に測定できます。パスの開始時と終了時のタイムスタンプクエリをキャプチャする API の形状が、WebGPU の仕様に合わせて更新されました。次の例と issue dawn:1800 をご覧ください。

// Create a timestamp query set that will store the timestamp values.
wgpu::QuerySetDescriptor querySetDescriptor = {
    .count = 2,
    .type = wgpu::QueryType::Timestamp};
wgpu::QuerySet querySet = device.CreateQuerySet(&querySetDescriptor);

wgpu::RenderPassTimestampWrites timestampWrites = {
    .querySet = querySet,
    .beginningOfPassWriteIndex = 0,
    .endOfPassWriteIndex = 1};
wgpu::ComputePassDescriptor pass{.timestampWrites = &timestampWrites};

// Write the queue timestamp into beginningOfPassWriteIndex and
// endOfPassWriteIndex of myQuerySet respectively before and after the pass
// commands execute.
myEncoder.BeginComputePass(&pass);

以下に、主なハイライトをいくつかご紹介します。コミットの一覧（すべて網羅）をご覧ください。