รองรับ WebGPU ใน Android
ทีม Chrome ยินดีที่จะประกาศว่าขณะนี้ WebGPU จะเปิดใช้งานโดยค่าเริ่มต้นใน Chrome 121 ในอุปกรณ์ที่ใช้ Android 12 ขึ้นไป ซึ่งขับเคลื่อนโดย Qualcomm และ ARM GPU
เราจะทยอยขยายการรองรับให้ครอบคลุมอุปกรณ์ Android หลากหลายรุ่นมากขึ้น รวมถึงอุปกรณ์ Android 11 ในอนาคตอันใกล้ การขยายตัวนี้จะขึ้นอยู่กับการทดสอบและการเพิ่มประสิทธิภาพเพิ่มเติม เพื่อให้มั่นใจว่าผู้ใช้จะได้รับประสบการณ์การใช้งานที่ราบรื่นไม่ว่าจะใช้การกำหนดค่าฮาร์ดแวร์แบบใด ดูปัญหา chromium:1497815
ใช้ DXC แทน FXC สำหรับการคอมไพล์ตัวปรับแสงเงาบน Windows
ปัจจุบัน Chrome ใช้ศักยภาพของ DXC (DirectX Compiler) เพื่อคอมไพล์ตัวปรับแสงเงาในเครื่อง Windows D3D12 ที่ติดตั้งฮาร์ดแวร์กราฟิก SM6+ ก่อนหน้านี้ WebGPU ต้องใช้ FXC (FX Compiler) ในการคอมไพล์ตัวปรับแสงเงาบน Windows ขณะทำงาน แต่ FXC ไม่มีชุดฟีเจอร์และการเพิ่มประสิทธิภาพที่มีอยู่ใน DXC
การทดสอบเริ่มต้นแสดงให้เห็นว่าความเร็วในการคอมไพล์ตัวปรับแสงเงาสำหรับการประมวลผลเพิ่มขึ้นเฉลี่ย 20% เมื่อใช้ DXC เทียบกับ FXC
การค้นหาการประทับเวลาในการประมวลผลและแสดงผลบัตร
การค้นหาการประทับเวลาช่วยให้แอปพลิเคชัน WebGPU วัดระยะเวลาที่คำสั่ง GPU ใช้ในการประมวลผลและแสดงผลบัตรได้อย่างแม่นยํา (จนถึงระดับนาโนวินาที) มีการใช้ข้อมูลเชิงลึกเหล่านี้เป็นอย่างมากเพื่อรับข้อมูลเชิงลึกเกี่ยวกับประสิทธิภาพและลักษณะการทำงานของภาระงาน GPU
เมื่อฟีเจอร์ "timestamp-query"
พร้อมใช้งานใน GPUAdapter
ตอนนี้คุณจะทำสิ่งต่อไปนี้ได้
- ขอรับ
GPUDevice
ด้วยฟีเจอร์"timestamp-query"
- สร้าง
GPUQuerySet
ประเภท"timestamp"
- ใช้
GPUComputePassDescriptor.timestampWrites
และGPURenderPassDescriptor.timestampWrites
เพื่อระบุตำแหน่งที่จะเขียนค่าการประทับเวลาในGPUQuerySet
- แก้ค่าการประทับเวลาเป็น
GPUBuffer
ด้วยresolveQuerySet()
- อ่านค่าการประทับเวลากลับมาโดยคัดลอกผลลัพธ์จาก
GPUBuffer
ไปยัง CPU - ถอดรหัสค่าการประทับเวลาเป็น
BigInt64Array
ดูตัวอย่างและปัญหา dawn:1800 ต่อไปนี้
const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has("timestamp-query")) {
throw new Error("Timestamp query feature is not available");
}
// Explicitly request timestamp query feature.
const device = await adapter.requestDevice({
requiredFeatures: ["timestamp-query"],
});
const commandEncoder = device.createCommandEncoder();
// Create a GPUQuerySet which holds 2 timestamp query results: one for the
// beginning and one for the end of compute pass execution.
const querySet = device.createQuerySet({ type: "timestamp", count: 2 });
const timestampWrites = {
querySet,
beginningOfPassWriteIndex: 0, // Write timestamp in index 0 when pass begins.
endOfPassWriteIndex: 1, // Write timestamp in index 1 when pass ends.
};
const passEncoder = commandEncoder.beginComputePass({ timestampWrites });
// TODO: Set pipeline, bind group, and dispatch work to be performed.
passEncoder.end();
// Resolve timestamps in nanoseconds as a 64-bit unsigned integer into a GPUBuffer.
const size = 2 * BigInt64Array.BYTES_PER_ELEMENT;
const resolveBuffer = device.createBuffer({
size,
usage: GPUBufferUsage.QUERY_RESOLVE | GPUBufferUsage.COPY_SRC,
});
commandEncoder.resolveQuerySet(querySet, 0, 2, resolveBuffer, 0);
// Read GPUBuffer memory.
const resultBuffer = device.createBuffer({
size,
usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
});
commandEncoder.copyBufferToBuffer(resolveBuffer, 0, resultBuffer, 0, size);
// Submit commands to the GPU.
device.queue.submit([commandEncoder.finish()]);
// Log compute pass duration in nanoseconds.
await resultBuffer.mapAsync(GPUMapMode.READ);
const times = new BigInt64Array(resultBuffer.getMappedRange());
console.log(`Compute pass duration: ${Number(times[1] - times[0])}ns`);
resultBuffer.unmap();
เนื่องด้วยข้อกังวลเกี่ยวกับการโจมตีในเวลา ข้อความค้นหาการประทับเวลาจะถูกวัดปริมาณด้วยความละเอียด 100 ไมโครวินาที ซึ่งให้ความคลาดเคลื่อนระหว่างความแม่นยำและความปลอดภัยได้เป็นอย่างดี ในเบราว์เซอร์ Chrome คุณสามารถปิดใช้การวัดปริมาณการประทับเวลาได้โดยการเปิดใช้ธง "ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU" ที่ chrome://flags/#enable-webgpu-developer-features
ระหว่างการพัฒนาแอป ดูการวัดปริมาณของคำค้นหาการประทับเวลาเพื่อดูข้อมูลเพิ่มเติม
เนื่องจาก GPU อาจรีเซ็ตตัวนับการประทับเวลาเป็นครั้งคราว ซึ่งอาจทำให้เกิดค่าที่ไม่คาดคิด เช่น เดลต้าเป็นลบระหว่างการประทับเวลา เราจึงขอแนะนำให้คุณดูการเปลี่ยนแปลงความแตกต่างของ git ที่เพิ่มการสนับสนุนการค้นหาการประทับเวลาลงในตัวอย่าง Compute Boids ต่อไปนี้
จุดแรกเข้าเริ่มต้นของโมดูลตัวปรับแสงเงา
เพื่อปรับปรุงประสบการณ์ของนักพัฒนาแอป ตอนนี้คุณสามารถละเว้น entryPoint
ของโมดูลตัวปรับแสงเงาเมื่อสร้างไปป์ไลน์การประมวลผลหรือแสดงผล หากไม่พบจุดแรกเข้าที่ไม่ซ้ำกันสำหรับขั้นตอนตัวปรับแสงเงาในโค้ดตัวปรับแสงเงา ระบบจะทริกเกอร์ GPUValidationError ดูตัวอย่างต่อไปนี้และปัญหารุ่งเช้า:2254
const code = `
@vertex fn vertexMain(@builtin(vertex_index) i : u32) ->
@builtin(position) vec4f {
const pos = array(vec2f(0, 1), vec2f(-1, -1), vec2f(1, -1));
return vec4f(pos[i], 0, 1);
}
@fragment fn fragmentMain() -> @location(0) vec4f {
return vec4f(1, 0, 0, 1);
}`;
const module = myDevice.createShaderModule({ code });
const format = navigator.gpu.getPreferredCanvasFormat();
const pipeline = await myDevice.createRenderPipelineAsync({
layout: "auto",
vertex: { module, entryPoint: "vertexMain" },
fragment: { module, entryPoint: "fragmentMain", targets: [{ format }] },
vertex: { module },
fragment: { module, targets: [{ format }] },
});
รองรับ display-p3 เป็นพื้นที่สี GPUExternalTexture
ตอนนี้คุณสามารถกำหนดพื้นที่สีปลายทาง "display-p3"
ได้เมื่อนำเข้า GPUExternalTexture จากวิดีโอ HDR ด้วย importExternalTexture()
ดูวิธีที่ WebGPU จัดการกับพื้นที่สี ดูตัวอย่างและปัญหา chromium:1330250 ต่อไปนี้
// Create texture from HDR video.
const video = document.querySelector("video");
const texture = myDevice.importExternalTexture({
source: video,
colorSpace: "display-p3",
});
ข้อมูลฮีปหน่วยความจำ
เพื่อช่วยคุณคาดการณ์ขีดจำกัดหน่วยความจำเมื่อจัดสรรปริมาณมากในระหว่างการพัฒนาแอป ตอนนี้ requestAdapterInfo()
จะแสดงข้อมูล memoryHeaps
เช่น ขนาดและประเภทของฮีปหน่วยความจำที่มีในอะแดปเตอร์ ฟีเจอร์ทดลองนี้จะเข้าถึงได้เมื่อเปิดใช้ธง "ฟีเจอร์สำหรับนักพัฒนาซอฟต์แวร์ WebGPU" ที่ chrome://flags/#enable-webgpu-developer-features
เท่านั้น ดูตัวอย่างต่อไปนี้และปัญหารุ่งเช้า:2249
const adapter = await navigator.gpu.requestAdapter();
const adapterInfo = await adapter.requestAdapterInfo();
for (const { size, properties } of adapterInfo.memoryHeaps) {
console.log(size); // memory heap size in bytes
if (properties & GPUHeapProperty.DEVICE_LOCAL) { /* ... */ }
if (properties & GPUHeapProperty.HOST_VISIBLE) { /* ... */ }
if (properties & GPUHeapProperty.HOST_COHERENT) { /* ... */ }
if (properties & GPUHeapProperty.HOST_UNCACHED) { /* ... */ }
if (properties & GPUHeapProperty.HOST_CACHED) { /* ... */ }
}
ข้อมูลอัปเดตเกี่ยวกับ Dawn
เพิ่มเมธอด HasWGSLLanguageFeature
และ EnumerateWGSLLanguageFeatures
ใน wgpu::Instance
เพื่อจัดการฟีเจอร์ภาษา WGSL ดูปัญหา dawn:2260
ฟีเจอร์ wgpu::Feature::BufferMapExtendedUsages
ที่ไม่ใช่แบบมาตรฐานช่วยให้คุณสร้างบัฟเฟอร์ GPU ด้วย wgpu::BufferUsage::MapRead
หรือ wgpu::BufferUsage::MapWrite
และ wgpu::BufferUsage
อื่นๆ ได้ ดูตัวอย่างและปัญหา dawn:2204 ต่อไปนี้
wgpu::BufferDescriptor descriptor = {
.size = 128,
.usage = wgpu::BufferUsage::MapWrite | wgpu::BufferUsage::Uniform
};
wgpu::Buffer uniformBuffer = device.CreateBuffer(&descriptor);
uniformBuffer.MapAsync(wgpu::MapMode::Write, 0, 128,
[](WGPUBufferMapAsyncStatus status, void* userdata)
{
wgpu::Buffer* buffer = static_cast<wgpu::Buffer*>(userdata);
memcpy(buffer->GetMappedRange(), data, sizeof(data));
},
&uniformBuffer);
ฟีเจอร์ต่อไปนี้มีบันทึกไว้ ได้แก่ การแชร์พื้นผิวของ ANGLE, ปกป้องโดยหลายเทรด D3D11, การซิงค์อุปกรณ์แบบไม่เจาะจงปลายทาง, รูปแบบพื้นผิว Norm16, Timestamp Query Inside Passes, Pixel Local Storage, ฟีเจอร์ Shader และรูปแบบ Multi Planar{/15 Multi Planar
ทีม Chrome ได้สร้างที่เก็บ GitHub อย่างเป็นทางการสำหรับ Dawn แล้ว
ทั้งหมดนี้พูดถึงไฮไลต์สำคัญเพียงบางส่วน ดูรายการสัญญาผูกมัดอย่างละเอียด
มีอะไรใหม่ใน WebGPU
รายการของทุกอย่างที่มีการพูดถึงในซีรีส์มีอะไรใหม่ใน WebGPU
Chrome 125
Chrome 124
- พื้นผิวพื้นที่เก็บข้อมูลแบบอ่านอย่างเดียวและอ่านอย่างเดียว
- การสนับสนุน Service Worker และตัวช่วยแบบแชร์
- แอตทริบิวต์ข้อมูลอะแดปเตอร์ใหม่
- แก้ไขข้อบกพร่อง
- ข้อมูลอัปเดตยามเช้า
Chrome 123
- การรองรับฟังก์ชันในตัวของ DP4a ใน WGSL
- พารามิเตอร์ตัวชี้แบบไม่จำกัดใน WGSL
- น้ำตาลไวยากรณ์สำหรับการยกเลิกการอ้างอิงคอมโพสิตใน WGSL
- สถานะแบบอ่านอย่างเดียวสำหรับมุมมองที่เป็นลายฉลุและความลึก
- ข้อมูลอัปเดตยามเช้า
Chrome 122
- ขยายการเข้าถึงด้วยโหมดความเข้ากันได้ (ฟีเจอร์อยู่ระหว่างการพัฒนา)
- เพิ่มขีดจํากัด maxVertexAttributes
- ข้อมูลอัปเดตยามเช้า
Chrome 121
- รองรับ WebGPU ใน Android
- ใช้ DXC แทน FXC สำหรับการคอมไพล์ตัวปรับแสงเงาใน Windows
- การค้นหาการประทับเวลาในการประมวลผลและแสดงผลบัตร
- จุดแรกเข้าเริ่มต้นไปยังโมดูลตัวปรับแสงเงา
- รองรับ display-p3 เป็นพื้นที่สี GPUExternalTexture
- ข้อมูลฮีพของหน่วยความจำ
- ข้อมูลอัปเดตยามเช้า
Chrome 120
- รองรับค่าจุดลอยตัว 16 บิตใน WGSL
- ก้าวข้ามขีดจำกัด
- การเปลี่ยนแปลงสถานะของฉลุลายความลึก
- การอัปเดตข้อมูลอะแดปเตอร์
- การวัดปริมาณของการค้นหาการประทับเวลา
- ฟีเจอร์ทำความสะอาดฤดูใบไม้ผลิ
Chrome 119
- พื้นผิวแบบลอยแบบ 32 บิตที่กรองได้
- รูปแบบ Verm10-10-10-2
- รูปแบบพื้นผิวของ rgb10a2uint
- ข้อมูลอัปเดตยามเช้า
Chrome 118
- การรองรับ HTMLImageElement และ ImageData ใน
copyExternalImageToTexture()
- การสนับสนุนแบบทดลองสำหรับพื้นผิวพื้นที่เก็บข้อมูลแบบอ่านอย่างเดียวและอ่านอย่างเดียว
- ข้อมูลอัปเดตยามเช้า
Chrome 117
- ยกเลิกการตั้งค่าบัฟเฟอร์เวอร์เท็กซ์
- ยกเลิกการตั้งค่ากลุ่มการเชื่อมโยง
- ปิดเสียงข้อผิดพลาดจากการสร้างไปป์ไลน์แบบไม่พร้อมกันเมื่ออุปกรณ์สูญหาย
- การอัปเดตการสร้างโมดูลตัวปรับแสงเงา SPIR-V
- การปรับปรุงประสบการณ์ของนักพัฒนาซอฟต์แวร์
- การแคชไปป์ไลน์ด้วยเลย์เอาต์ที่สร้างขึ้นโดยอัตโนมัติ
- ข้อมูลอัปเดตยามเช้า
Chrome 116
- การผสานรวม WebCodecs
- อุปกรณ์ที่สูญหายได้รับคืนโดย GPUAdapter
requestDevice()
- เล่นวิดีโอได้ลื่นไหลแม้เรียกใช้
importExternalTexture()
- ความสอดคล้องของข้อกำหนด
- การปรับปรุงประสบการณ์ของนักพัฒนาซอฟต์แวร์
- ข้อมูลอัปเดตยามเช้า
Chrome 115
- ส่วนขยายภาษา WGSL ที่รองรับ
- การสนับสนุนแบบทดลองสำหรับ Direct3D 11
- รับ GPU แบบแยกกันโดยค่าเริ่มต้นเมื่อใช้ไฟ AC
- การปรับปรุงประสบการณ์ของนักพัฒนาซอฟต์แวร์
- ข้อมูลอัปเดตยามเช้า
Chrome 114
- เพิ่มประสิทธิภาพ JavaScript
- getCurrentTexture() ใน Canvas ที่ไม่ได้กำหนดค่าแสดงข้อผิดพลาด invalidStateError
- ข้อมูลอัปเดตเกี่ยวกับ WGSL
- ข้อมูลอัปเดตยามเช้า