copyExternalImageToTexture() 支援 HTMLImageElement 和 ImageData
GPUQueue
上的 copyExternalImageToTexture()
方法可讓您將從來源圖片、影片或畫布擷取的快照複製到指定 GPUTexture
。您現在可以傳遞 HTMLImageElement
和 ImageData
物件做為來源。請參閱以下範例和這個 Chromium 問題。
// Fetch and decode image.
const source = document.createElement("img");
source.src = "my-image.png";
await source.decode();
// Create destination texture.
const size = [source.width, source.height];
const texture = myDevice.createTexture({
size,
format: "rgba8unorm",
usage:
GPUTextureUsage.COPY_DST |
GPUTextureUsage.RENDER_ATTACHMENT |
GPUTextureUsage.TEXTURE_BINDING,
});
// Copies a snapshot taken from the source image into a texture.
myDevice.queue.copyExternalImageToTexture({ source }, { texture }, size);
實驗性支援讀寫和唯讀儲存空間紋理
儲存紋理繫結類型可讓您執行紋理讀取作業,不必取樣,並儲存至著色器中的任意位置。如果 GPUAdapter
中提供 "chromium-experimental-read-write-storage-texture"
功能,您現在可以要求使用這項功能的 GPUDevice
,並在建立繫結群組版面配置時,將 GPUStorageTexture
存取權設為 "read-write"
或 "read-only"
。先前僅限於 "write-only"
。
如要善用這項功能,請務必在 WGSL 程式碼中,使用 enable chromium_experimental_read_write_storage_texture
明確啟用這項擴充功能。啟用後,您可以使用儲存空間紋理的 read_write
和 read
存取限定符,textureLoad()
和 textureStore()
內建函式也會相應運作,且您可以使用新的 textureBarrier()
內建函式,在工作群組中同步處理紋理記憶體存取作業。請參閱以下範例和問題 dawn:1972。
這項功能仍在實驗階段,可能還會變動。在標準化的同時,請使用 --enable-dawn-features=allow_unsafe_apis
旗標執行 Chrome,即可使用這項功能。
const feature = "chromium-experimental-read-write-storage-texture";
const adapter = await navigator.gpu.requestAdapter();
if (!adapter.features.has(feature)) {
throw new Error("Read-write storage texture support is not available");
}
// Explicitly request read-write storage texture support.
const device = await adapter.requestDevice({
requiredFeatures: [feature],
});
const bindGroupLayout = device.createBindGroupLayout({
entries: [{
binding: 0,
visibility: GPUShaderStage.COMPUTE,
storageTexture: {
access: "read-write", // <-- New!
format: "r32uint",
},
}],
});
const shaderModule = device.createShaderModule({ code: `
enable chromium_experimental_read_write_storage_texture;
@group(0) @binding(0) var tex : texture_storage_2d<r32uint, read_write>;
@compute @workgroup_size(1, 1)
fn main(@builtin(local_invocation_id) local_id: vec3u) {
var data = textureLoad(tex, vec2i(local_id.xy));
data.x *= 2;
textureStore(tex, vec2i(local_id.xy), data);
}`,
});
// You can now create a compute pipeline with this shader module and
// send the appropriate commands to the GPU.
黎明更新
為確保一致性,webgpu.h C API 已重新命名下列欄位:requiredFeaturesCount
改為 requiredFeatureCount
、pipelineStatisticsCount
改為 pipelineStatisticCount
,以及 colorFormatsCount
改為 colorFormatCount
。請參閱問題 dawn:146040。
新的 DawnInfo
程式 (類似於 vulkaninfo) 可讓您列出切換開關、配接器、配接器功能和配接器限制。建構 dawn samples
時可以使用。為簡潔起見,以下輸出內容經過大幅修剪。請參閱變更 dawn:149020。
./out/Debug/DawnInfo
Toggles
=======
Name: allow_unsafe_apis
Suppresses validation errors on API entry points or parameter combinations
that aren't considered secure yet.
http://crbug.com/1138528
[…]
Adapter
=======
VendorID: 0x106B
Vendor: apple
Architecture: common-3
DeviceID: 0x0000
Name: Apple M1 Pro
Driver description: Metal driver on macOS Version 13.5.1 (Build 22G90)
Adapter Type: discrete GPU
Backend Type: Metal
Power: <undefined>
Features
========
* depth_clip_control
Disable depth clipping of primitives to the clip volume
https://bugs.chromium.org/p/dawn/issues/detail?id=1178
[…]
Adapter Limits
==============
maxTextureDimension1D: 16,384
maxTextureDimension2D: 16,384
[…]
這僅涵蓋部分重點。請參閱完整的提交清單。
WebGPU 最新消息
「WebGPU 最新消息」系列涵蓋的所有主題清單。
Chrome 140
- 裝置要求會耗用轉接程式
- 使用紋理檢視畫面時,可使用紋理的簡短形式
- WGSL textureSampleLevel 支援 1D 紋理
- 淘汰 bgra8unorm 唯讀儲存空間紋理用法
- 移除 GPUAdapter isFallbackAdapter 屬性
- Dawn 更新
Chrome 139
Chrome 138
Chrome 137
- 使用紋理檢視區塊進行 externalTexture 繫結
- 複製緩衝區,但不指定位移和大小
- WGSL 工作群組 UniformLoad,使用指標指向原子
- GPUAdapterInfo powerPreference 屬性
- 移除 GPURequestAdapterOptions compatibilityMode 屬性
- Dawn 更新
Chrome 136
Chrome 135
- 允許使用空值繫結群組版面配置建立管道版面配置
- 允許檢視區塊超出算繪目標的邊界
- 在 Android 上更輕鬆存取實驗性相容模式
- 移除 maxInterStageShaderComponents 限制
- Dawn 更新
Chrome 134
Chrome 133
- 額外的 unorm8x4-bgra 和 1 元件頂點格式
- 允許使用未定義的值要求不明限制
- WGSL 對齊規則變更
- 使用 discard 提升 WGSL 效能
- 針對外部紋理使用 VideoFrame displaySize
- 使用 copyExternalImageToTexture 處理方向非預設的圖片
- 提升開發人員體驗
- 使用 featureLevel 啟用相容模式
- 清除實驗性子群組功能
- 淘汰 maxInterStageShaderComponents 限制
- Dawn 更新
Chrome 132
- 紋理檢視畫面使用方式
- 32 位元浮點紋理混合
- GPUDevice adapterInfo 屬性
- 以無效格式設定畫布內容時,會擲回 JavaScript 錯誤
- 紋理的篩選取樣器限制
- 擴大子群組實驗
- 提升開發人員體驗
- 實驗性支援 16 位元標準化紋理格式
- Dawn 更新
Chrome 131
- 在 WGSL 中裁剪距離
- GPUCanvasContext getConfiguration()
- 點和線條圖元不得有深度偏差
- 子群組的內建包容性掃描功能
- 實驗性支援多重繪圖間接
- 著色器模組編譯選項「嚴格的數學」
- 移除 GPUAdapter requestAdapterInfo()
- Dawn 更新
Chrome 130
Chrome 129
Chrome 128
Chrome 127
Chrome 126
Chrome 125
Chrome 124
Chrome 123
Chrome 122
Chrome 121
- 在 Android 上支援 WebGPU
- 在 Windows 上使用 DXC 取代 FXC,編譯著色器
- 運算和算繪傳遞中的時間戳記查詢
- 著色器模組的預設進入點
- 支援將 display-p3 做為 GPUExternalTexture 色彩空間
- 記憶體堆積資訊
- Dawn 更新
Chrome 120
Chrome 119
Chrome 118
copyExternalImageToTexture()
支援 HTMLImageElement 和 ImageData- 實驗性支援讀寫和唯讀儲存空間紋理
- Dawn 更新
Chrome 117
Chrome 116
- 整合 WebCodecs
- GPUAdapter
requestDevice()
傳回的遺失裝置 - 如果呼叫
importExternalTexture()
,請確保影片播放流暢 - 規格一致性
- 提升開發人員體驗
- Dawn 更新
Chrome 115
Chrome 114
Chrome 113
- 在
importExternalTexture()
中使用 WebCodecs VideoFrame 來源