Hỗ trợ HDR với chế độ ánh xạ tông màu canvas
Nhà phát triển web có ít lựa chọn để phân phối nội dung HDR, chủ yếu dựa vào các phần tử <img>
và <video>
. Tuy nhiên, phần tử <canvas>
vẫn bị hạn chế ở SDR. Để tạo nội dung HDR động trong canvas, bạn cần mã hoá nội dung đó dưới dạng hình ảnh HDR trước khi hiển thị (xem bản minh hoạ này để biết ví dụ).
Tham số GPUCanvasToneMappingMode
mới trong cấu hình canvas WebGPU hiện cho phép WebGPU vẽ các màu sáng hơn màu trắng (#FFFFFF
). Tham số này thực hiện việc đó thông qua các chế độ sau:
"standard"
: Hành vi mặc định hạn chế nội dung trong phạm vi SDR của màn hình. Chế độ này được thực hiện bằng cách kẹp tất cả các giá trị màu trong không gian màu của màn hình vào khoảng[0, 1]
."extended"
: Mở khoá toàn bộ dải tương phản động (HDR) của màn hình. Chế độ này khớp với"standard"
trong phạm vi[0, 1]
của màn hình. Việc kẹp hoặc chiếu được thực hiện cho dải tương phản động mở rộng của màn hình nhưng không phải[0, 1]
.
Đoạn mã sau đây cho biết cách định cấu hình một canvas cho dải tương phản động cao.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();
const canvas = document.querySelector("canvas");
const context = canvas.getContext("webgpu");
context.configure({
device,
format: "rgba16float",
toneMapping: { mode: "extended" },
});
Khám phá HDR bằng WebGPU bằng cách xem Mẫu hạt (HDR) và Ví dụ về HDR WebGPU, đồng thời xem mục chromestatus.

Hỗ trợ nhóm con mở rộng
Sau thông báo về thử nghiệm nhóm con, các hàm tích hợp nhóm con hiện có thể dùng trong cả chương trình đổ bóng tính toán và chương trình đổ bóng mảnh. Chúng không còn bị giới hạn chỉ ở các chương trình đổ bóng điện toán nữa. Hãy xem vấn đề 354738715.
Xin lưu ý rằng giá trị tích hợp sẵn subgroup_size
hiện đang có lỗi trong chương trình đổ bóng mảnh. Tạm thời tránh sử dụng.
Ngoài ra, các hàm tích hợp của nhóm con sau đây đã được thêm:
subgroupAdd(value)
: Trả về tổng của tất cả các lệnh gọivalue
đang hoạt động trên toàn bộ nhóm con.subgroupExclusiveAdd(value)
: Trả về tổng số lần quét riêng biệt của tất cả các lệnh gọivalue
đang hoạt động trên toàn bộ nhóm con.subgroupMul(value)
: Trả về phép nhân của tất cả các lệnh gọi đang hoạt độngvalue
trên nhóm con.subgroupExclusiveMul(value)
: Trả về phép nhân quét loại trừ của tất cả các lệnh gọi đang hoạt độngvalue
trên toàn bộ nhóm con.subgroupAnd(value)
: Trả về phép toán AND nhị phân của tất cả các lệnh gọi đang hoạt độngvalue
trên toàn bộ nhóm con.subgroupOr(value)
: Trả về phép OR nhị phân của tất cả các lệnh gọi đang hoạt độngvalue
trên toàn bộ nhóm con.subgroupXor(value)
: Trả về XOR nhị phân của tất cả các lệnh gọi đang hoạt độngvalue
trên nhóm con.subgroupMin(value)
: Trả về giá trị tối thiểu của tất cả các lệnh gọivalue
đang hoạt động trong nhóm con.subgroupMax(value)
: Trả về giá trị tối đa của tất cả các lệnh gọi đang hoạt độngvalue
trong nhóm con.subgroupAll(value)
: Trả về giá trị true nếuvalue
là true cho tất cả các lệnh gọi đang hoạt động trong nhóm con.subgroupAny(value)
: Trả về giá trị true nếuvalue
là true cho mọi lệnh gọi đang hoạt động trong nhóm con.subgroupElect()
: Trả về true nếu lệnh gọi này cósubgroup_invocation_id
thấp nhất trong số các lệnh gọi đang hoạt động trong nhóm con.subgroupBroadcastFirst(value)
: Truyềnvalue
từ lệnh gọi đang hoạt động cósubgroup_invocation_id
thấp nhất trong nhóm con đến tất cả các lệnh gọi đang hoạt động khác.subgroupShuffle(value, id)
: Trả vềvalue
từ lệnh gọi đang hoạt động cósubgroup_invocation_id
khớp vớiid
.subgroupShuffleXor(value, mask)
: Trả vềvalue
từ lệnh gọi đang hoạt động cósubgroup_invocation_id
khớp vớisubgroup_invocation_id ^ mask
.mask
phải đồng nhất một cách linh hoạt.subgroupShuffleUp(value, delta)
: Trả vềvalue
từ lệnh gọi đang hoạt động cósubgroup_invocation_id
khớp vớisubgroup_invocation_id - delta
.subgroupShuffleDown(value, delta)
: Trả vềvalue
từ lệnh gọi đang hoạt động cósubgroup_invocation_id
khớp vớisubgroup_invocation_id + delta
.quadBroadcast(value, id)
: Truyềnvalue
từ lệnh gọi quad có mã nhận dạng bằngid
.id
phải là một biểu thức hằng số.quadSwapX(value)
: Hoán đổivalue
giữa các lệnh gọi trong tứ giác theo hướng X.quadSwapY(value)
: Hoán đổivalue
giữa các lệnh gọi trong nhóm bốn theo hướng Y.quadSwapDiagonal(value)
: Hoán đổivalue
giữa các lệnh gọi trong tứ giác theo đường chéo.
Thông tin cập nhật về bình minh
Giờ đây, cấu trúc wgpu::PrimitiveState
sẽ trực tiếp bao gồm chế độ cài đặt kiểm soát đoạn cắt theo độ sâu, giúp bạn không cần dùng cấu trúc wgpu::PrimitiveDepthClipControl
riêng biệt. Để tìm hiểu thêm, hãy xem đoạn mã sau và webgpu-headers PR.
// Before
wgpu::PrimitiveState primitive = {};
wgpu::PrimitiveDepthClipControl depthClipControl;
depthClipControl.unclippedDepth = true;
primitive.nextInChain = &depthClipControl;
// Now
wgpu::PrimitiveState primitive = {};
primitive.unclippedDepth = true;
Đâ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
- Yêu cầu thiết bị sử dụng bộ điều hợp
- Cách viết tắt để sử dụng hoạ tiết khi chế độ xem hoạ tiết được dùng
- WGSL textureSampleLevel hỗ trợ kết cấu 1D
- Không dùng nữa việc sử dụng kết cấu lưu trữ chỉ đọc bgra8unorm
- Xoá thuộc tính GPUAdapter isFallbackAdapter
- Thông tin cập nhật về Dawn
Chrome 139
- Hỗ trợ kết cấu 3D cho các định dạng nén BC và ASTC
- Tính năng mới "core-features-and-limits"
- Thử nghiệm nguồn gốc cho chế độ tương thích WebGPU
- Thông tin cập nhật về Dawn
Chrome 138
- Viết tắt của việc sử dụng vùng đệm làm tài nguyên liên kết
- Thay đổi yêu cầu về kích thước đối với các vùng đệm được liên kết tại thời điểm tạo
- Báo cáo về cấu trúc cho các GPU gần đây
- Ngừng sử dụng thuộc tính GPUAdapter isFallbackAdapter
- Thông tin cập nhật về Dawn
Chrome 137
- Sử dụng khung hiển thị kết cấu để liên kết externalTexture
- Sao chép vùng đệm mà không chỉ định độ lệch và kích thước
- WGSL workgroupUniformLoad sử dụng con trỏ đến atomic
- Thuộc tính powerPreference của GPUAdapterInfo
- Xoá thuộc tính compatibilityMode của GPURequestAdapterOptions
- Thông tin cập nhật về Dawn
Chrome 136
- Thuộc tính GPUAdapterInfo isFallbackAdapter
- Cải thiện thời gian biên dịch chương trình đổ bóng trên D3D12
- Lưu và sao chép hình ảnh trên canvas
- Các quy định hạn chế đối với chế độ tương thích của Lift
- Thông tin cập nhật về Dawn
Chrome 135
- Cho phép tạo bố cục quy trình bằng bố cục nhóm liên kết rỗng
- Cho phép khung hiển thị mở rộng ra ngoài giới hạn của mục tiêu kết xuất
- Dễ dàng truy cập hơn vào chế độ tương thích thử nghiệm trên Android
- Xoá giới hạn maxInterStageShaderComponents
- Thông tin cập nhật về Dawn
Chrome 134
- Cải thiện khối lượng công việc học máy bằng các nhóm con
- Xoá chế độ hỗ trợ các loại kết cấu có thể lọc dấu phẩy động dưới dạng kết hợp
- Thông tin cập nhật về Dawn
Chrome 133
- Các định dạng đỉnh 1 thành phần và unorm8x4-bgra khác
- Cho phép yêu cầu các giới hạn không xác định bằng giá trị không xác định
- Thay đổi quy tắc căn chỉnh WGSL
- Tăng hiệu suất WGSL bằng cách loại bỏ
- Sử dụng VideoFrame displaySize cho các hoạ tiết bên ngoài
- Xử lý hình ảnh có hướng không mặc định bằng copyExternalImageToTexture
- Cải thiện trải nghiệm của nhà phát triển
- Bật chế độ tương thích bằng featureLevel
- Dọn dẹp các tính năng thử nghiệm của nhóm con
- Ngừng sử dụng giới hạn maxInterStageShaderComponents
- Thông tin cập nhật về Dawn
Chrome 132
- Cách sử dụng khung hiển thị kết cấu
- Kết hợp hoạ tiết dấu phẩy động 32 bit
- Thuộc tính adapterInfo của GPUDevice
- Định cấu hình ngữ cảnh canvas bằng định dạng không hợp lệ sẽ gây ra lỗi JavaScript
- Lọc các hạn chế về bộ lấy mẫu trên kết cấu
- Thử nghiệm nhóm con mở rộng
- Cải thiện trải nghiệm của nhà phát triển
- Hỗ trợ thử nghiệm cho các định dạng hoạ tiết được chuẩn hoá 16 bit
- Thông tin cập nhật về Dawn
Chrome 131
- Khoảng cách cắt trong WGSL
- GPUCanvasContext getConfiguration()
- Các thành phần cơ bản của điểm và đường không được có độ lệch về độ sâu
- Các hàm tích hợp quét toàn diện cho các nhóm nhỏ
- Hỗ trợ thử nghiệm cho tính năng vẽ gián tiếp nhiều lần
- Lựa chọn biên dịch mô-đun chương trình đổ bóng strict math
- Xoá GPUAdapter requestAdapterInfo()
- Thông tin cập nhật về Dawn
Chrome 130
- Kết hợp hai nguồn
- Cải thiện thời gian biên dịch chương trình đổ bóng trên Metal
- Ngừng sử dụng requestAdapterInfo() của GPUAdapter
- Thông tin cập nhật về Dawn
Chrome 129
Chrome 128
- Thử nghiệm với các nhóm nhỏ
- Không dùng chế độ đặt độ lệch độ sâu cho đường thẳng và điểm
- Ẩn cảnh báo Công cụ cho nhà phát triển về lỗi chưa được ghi lại nếu preventDefault
- WGSL nội suy lấy mẫu trước và một trong hai
- Thông tin cập nhật về Dawn
Chrome 127
- Hỗ trợ thử nghiệm cho OpenGL ES trên Android
- Thuộc tính thông tin GPUAdapter
- Cải thiện khả năng tương tác của WebAssembly
- Cải thiện lỗi bộ mã hoá lệnh
- Thông tin cập nhật về Dawn
Chrome 126
- Tăng giới hạn maxTextureArrayLayers
- Tối ưu hoá quá trình tải vùng đệm lên cho phần phụ trợ Vulkan
- Cải thiện thời gian biên dịch chương trình đổ bóng
- Các vùng đệm lệnh đã gửi phải là duy nhất
- Thông tin cập nhật về Dawn
Chrome 125
Chrome 124
- Kết cấu bộ nhớ chỉ đọc và đọc-ghi
- Hỗ trợ service worker và shared worker
- Thuộc tính thông tin mới về bộ chuyển đổi
- Sửa lỗi
- Thông tin cập nhật về Dawn
Chrome 123
- Hỗ trợ các hàm tích hợp DP4a trong WGSL
- Các tham số con trỏ không bị hạn chế trong WGSL
- Cú pháp đơn giản để huỷ tham chiếu các thành phần trong WGSL
- Trạng thái chỉ đọc riêng biệt cho các khía cạnh khuôn tô và độ sâu
- Thông tin cập nhật về Dawn
Chrome 122
- Mở rộng phạm vi tiếp cận bằng chế độ tương thích (tính năng đang được phát triển)
- Tăng giới hạn maxVertexAttributes
- Thông tin cập nhật về Dawn
Chrome 121
- Hỗ trợ WebGPU trên Android
- Sử dụng DXC thay vì FXC để biên dịch chương trình đổ bóng trên Windows
- Truy vấn dấu thời gian trong các lượt tính toán và kết xuất
- Điểm truy cập mặc định vào các mô-đun chương trình đổ bóng
- Hỗ trợ display-p3 làm không gian màu GPUExternalTexture
- Thông tin về vùng nhớ heap
- Thông tin cập nhật về Dawn
Chrome 120
- Hỗ trợ các giá trị dấu phẩy động 16 bit trong WGSL
- Phá vỡ giới hạn
- Các thay đổi đối với trạng thái khuôn tô chiều sâu
- Thông tin cập nhật về bộ chuyển đổi
- Lượng tử hoá truy vấn dấu thời gian
- Các tính năng dọn dẹp đón mùa xuân
Chrome 119
- Kết cấu dấu phẩy động 32 bit có thể lọc
- định dạng đỉnh unorm10-10-10-2
- Định dạng hoạ tiết rgb10a2uint
- Thông tin cập nhật về Dawn
Chrome 118
- Hỗ trợ HTMLImageElement và ImageData trong
copyExternalImageToTexture()
- Hỗ trợ thử nghiệm cho hoạ tiết lưu trữ chỉ đọc và đọc-ghi
- Thông tin cập nhật về Dawn
Chrome 117
- Huỷ thiết lập vùng đệm đỉnh
- Huỷ đặt nhóm liên kết
- Không hiển thị lỗi khi tạo quy trình không đồng bộ nếu thiết bị bị mất
- Thông tin cập nhật về việc tạo mô-đun chương trình đổ bóng SPIR-V
- Cải thiện trải nghiệm của nhà phát triển
- Các quy trình lưu vào bộ nhớ đệm có bố cục được tạo tự động
- Thông tin cập nhật về Dawn
Chrome 116
- Tích hợp WebCodecs
- Thiết bị bị mất do GPUAdapter
requestDevice()
trả về - Duy trì chế độ phát video mượt mà nếu
importExternalTexture()
được gọi - Sự tuân thủ quy cách
- Cải thiện trải nghiệm của nhà phát triển
- Thông tin cập nhật về Dawn
Chrome 115
- Các tiện ích ngôn ngữ WGSL được hỗ trợ
- Hỗ trợ thử nghiệm cho Direct3D 11
- Nhận GPU rời theo mặc định khi dùng nguồn điện AC
- Cải thiện trải nghiệm của nhà phát triển
- Thông tin cập nhật về Dawn
Chrome 114
- Tối ưu hoá JavaScript
- getCurrentTexture() trên canvas chưa thiết lập sẽ gửi InvalidStateError
- Thông tin cập nhật về WGSL
- Thông tin cập nhật về Dawn