Tính năng mới trong WebGPU (Chrome 137)

François Beaufort
François Beaufort

Ngày xuất bản: 26 tháng 5 năm 2025

Sử dụng khung hiển thị kết cấu để liên kết externalTexture

Giờ đây, bạn có thể sử dụng GPUTextureView (2D, một tài nguyên phụ) tương thích thay cho một liên kết GPUExternalTexture khi tạo GPUBindGroup.

Điều này giúp đơn giản hoá logic của chương trình đổ bóng trong các quy trình hiệu ứng video, trong đó cả GPUExternalTexture (cho video nguồn) và GPUTextureView (cho quá trình xử lý trung gian) đều phải được xử lý. Việc này cũng giúp giảm nhu cầu biên dịch động các chương trình đổ bóng, tuỳ thuộc vào nguồn gốc của hoạ tiết. Xem Intent to Ship: WebGPU: GPUTextureView for externalTexture binding (Dự định phát hành: WebGPU: GPUTextureView để liên kết externalTexture).

const texture = myDevice.createTexture({
  size: [42, 42],
  format: navigator.gpu.getPreferredCanvasFormat(),
  usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING,
});

const code = `
@group(0) @binding(0) var texture : texture_external;
@group(0) @binding(1) var<storage, read_write> buffer: vec2u;
    
@compute @workgroup_size(1) fn main() {
  buffer = textureDimensions(texture);
}`;

const pipeline = myDevice.createComputePipeline({
  layout: "auto",
  compute: { module: myDevice.createShaderModule({ code }) },
});

const bindGroup = myDevice.createBindGroup({
  layout: pipeline.getBindGroupLayout(0),
  entries: [
    { binding: 0, resource: texture.createView() }, // Use texture view for an externalTexture binding
    { binding: 1, resource: { buffer: myBuffer } },
  ],
});

Sao chép vùng đệm mà không chỉ định độ lệch và kích thước

Một phương thức GPUCommandEncoder mới cho phép nhà phát triển bỏ qua các tham số về độ lệch và kích thước khi sử dụng copyBufferToBuffer() để đơn giản hoá việc sao chép toàn bộ vùng đệm. Xem Ý định phát hành: WebGPU: copyBufferToBuffer overload.

const size = 42;
const srcBuffer = myDevice.createBuffer({
  size,
  usage: GPUBufferUsage.STORAGE | GPUBufferUsage.COPY_SRC,
});
const dstBuffer = myDevice.createBuffer({
  size,
  usage: GPUBufferUsage.COPY_DST | GPUBufferUsage.MAP_READ,
});

// Copy entire buffer.
myCommandEncoder.copyBufferToBuffer(srcBuffer, dstBuffer);

// This is the same as the following.
// myCommandEncoder.copyBufferToBuffer(srcBuffer, 0, dstBuffer, 0, size);

WGSL workgroupUniformLoad bằng cách sử dụng con trỏ đến atomic

Một phương thức nạp chồng workgroupUniformLoad(ptr) mới trong WGSL đã được thêm vào để mang lại sự thuận tiện cho nhà phát triển. Thao tác này sẽ tự động tải giá trị được trỏ đến bởi ptr và trả về giá trị đó cho tất cả các lệnh gọi trong nhóm công việc, trong đó ptr là con trỏ đến nguyên tử bên trong một biến nhóm công việc. Xem vấn đề 408241039.

@group(0) @binding(0) var<storage, read_write> buffer : array<u32, 1>;

var<workgroup> wgvar : atomic<u32>;

@compute @workgroup_size(1, 1)
fn main(@builtin(local_invocation_index) lid: u32) {
  if (lid == 0) {
    atomicStore(&(wgvar), 42u);
  }
  buffer[lid] = workgroupUniformLoad(&wgvar);
}

Thuộc tính powerPreference của GPUAdapterInfo

Thuộc tính chuỗi GPUAdapterInfo powerPreference không chuẩn hiện có sẵn khi người dùng đã bật cờ "WebGPU Developer Features" (Các tính năng dành cho nhà phát triển WebGPU) tại chrome://flags/#enable-webgpu-developer-features. Nếu được hỗ trợ, giá trị powerPreference có thể là "low-power" hoặc "high-performance", tuỳ thuộc vào giá trị GPUPowerPreference được dùng trong GPURequestAdapterOptions. Xem CL 6438860.

function checkPowerPreferenceForGpuDevice(device) {
  const powerPreference = device.adapterInfo.powerPreference;
  if (powerPreference === "high-performance") {
    // High-performance GPU detected. Enabling enhanced graphics settings.
  } else if (powerPreference === "low-power") {
    // Low-power GPU detected. Optimizing for battery life.
  }
}

Xoá thuộc tính compatibilityMode của GPURequestAdapterOptions

Thuộc tính GPURequestAdapterOptions compatibilityMode thử nghiệm đã bị xoá để chuyển sang thuộc tính featureLevel được tiêu chuẩn hoá đã thêm trong Chrome 133. Hãy xem vấn đề 366151404.

Thông tin cập nhật về bình minh

Nhà phát triển có thể tạo các dự án WebGPU bằng các ngôn ngữ như C++, sử dụng webgpu.h để nhắm đến cả WebAssembly và các nền tảng cụ thể. "emdawnwebgpu" ("Emscripten Dawn WebGPU") mới phát hành của Dawn triển khai webgpu.h được chuẩn hoá mới nhất qua API trình duyệt.

Emdawnwebgpu là một nhánh (được duy trì) của các liên kết tích hợp (USE_WEBGPU) của Emscripten (hiện không được duy trì). Mọi hoạt động phát triển mới đều đang được thực hiện trên emdawnwebgpu và các liên kết tích hợp của Emscripten sẽ bị xoá khi nhà phát triển chuyển sang emdawnwebgpu. Tiêu đề C của Emdawnwebgpu rất gần với tiêu đề C của Dawn, trong khi các liên kết tích hợp đã lỗi thời đáng kể.

Tải emdawnwebgpu xuống từ trang phát hành của Dawn trên GitHub và đọc README.md của gói để biết thông tin về cách sử dụng. Bạn có thể tìm thấy các tệp nguồn trong kho lưu trữ Dawn.

Để xem hướng dẫn đầy đủ, hãy tham khảo tài liệu Tạo ứng dụng bằng WebGPU mới cập nhật.

Đây chỉ là một số điểm nổi bật chính. Xem danh sách đầy đủ các cam kết.

Tính năng mới trong WebGPU

Danh sách mọi nội dung đã được đề cập trong loạt bài Tính năng mới trong WebGPU.

Chrome 140

Chrome 139

Chrome 138

Chrome 137

Chrome 136

Chrome 135

Chrome 134

Chrome 133

Chrome 132

Chrome 131

Chrome 130

Chrome 129

Chrome 128

Chrome 127

Chrome 126

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