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

WebGPU の新機能（Chrome 119）

François Beaufort

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

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

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

すべての GPU がフィルタ可能な 32 ビット浮動小数点テクスチャをサポートしているわけではありません。"float32-filterable" 機能が GPUAdapter で利用できる場合、この機能を使用して 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 頂点形式

「unorm10-10-10-2」という新しい頂点形式別名「rgb10a2」WebGPU の仕様に追加されました。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 テクスチャ形式

「rgb10a2uint」という新しいテクスチャ形式WebGPU の仕様に追加されました。これは、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....

夜明けの最新情報

タイムスタンプクエリを使用すると、WebGPU アプリケーションは GPU コマンドの実行にかかる時間を正確に（ナノ秒単位で）測定できます。パスの開始時と終了時のタイムスタンプクエリをキャプチャする API の形状が、WebGPU の仕様に合わせて更新されました。次の例と問題 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);

ここでは、主なハイライトの一部のみを取り上げています。コミットの一覧をご確認ください。