มีอะไรใหม่ใน WebGPU (Chrome 119)

François Beaufort
François Beaufort
GitHub

พื้นผิวแบบลอยแบบ 32 บิตที่กรองได้

พื้นผิวจุดลอยตัว 32 บิตนั้นใช้เก็บข้อมูลที่มีความแม่นยำสูง เช่น รูปภาพ HDR และแผนที่ที่มีความลึก และมีความสำคัญอย่างยิ่งสำหรับ GPU ที่ใช้ในเกมระดับไฮเอนด์และแอปพลิเคชันระดับมืออาชีพ

การรองรับพื้นผิวแบบลอยแบบ 32 บิตที่กรองได้จะอธิบายความสามารถของ GPU เพื่อกรองพื้นผิวที่เป็นจุดลอยตัว 32 บิต ซึ่งหมายความว่า GPU สามารถตัดขอบของพื้นผิวที่เป็นจุดลอยตัวให้เรียบ ทำให้ดูมีความหยักน้อยลง โดยจะคล้ายกับส่วนขยาย "OES_texture_Flo_linear" ใน WebGL

GPU บางส่วนไม่รองรับพื้นผิวแบบลอยแบบ 32 บิตที่กรองได้ เมื่อฟีเจอร์ "float32-filterable" พร้อมใช้งานใน GPUAdapter ตอนนี้คุณจะขอ GPUDevice โดยใช้ฟีเจอร์นี้ได้ รวมถึงพื้นผิวตัวกรองที่มีรูปแบบ "r32Flo", "rg32Flo" และ "rgba32Flo" ดูตัวอย่างต่อไปนี้และปัญหารุ่งเช้า: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....

รูปแบบ Verm10-10-10-2

เพิ่มรูปแบบ Vertex ใหม่ชื่อ "unorm10-10-10-2" หรือ "rgb10a2" ในข้อมูลจำเพาะของ WebGPU ซึ่งประกอบด้วยค่า 32 บิตที่อัดแน่นไปด้วยค่าจำนวนเต็มที่ไม่มีเครื่องหมายมาตรฐาน 4 ค่า โดยจัดเรียงตาม 10 บิต, 10 บิต, 10 บิต และ 2 บิต ดูตัวอย่างต่อไปนี้และปัญหารุ่งอรุณ: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 ซึ่งประกอบด้วยรูปแบบพิกเซล 32 บิตที่มีส่วนประกอบของจำนวนเต็มที่ไม่มีเครื่องหมาย 4 รายการ ได้แก่ สีแดง 10 บิต สีเขียว 10 บิต สีน้ำเงิน 10 บิต และอัลฟ่า 2 บิต ดูตัวอย่างต่อไปนี้และปัญหารุ่งเช้า: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 แล้ว ดูตัวอย่างต่อไปนี้และปัญหารุ่งเช้า: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);

ทั้งหมดนี้พูดถึงไฮไลต์สำคัญเพียงบางส่วน ดูรายการสัญญาผูกมัดอย่างละเอียด

มีอะไรใหม่ใน WebGPU

รายการของทุกอย่างที่มีการพูดถึงในซีรีส์มีอะไรใหม่ใน WebGPU

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113