Yang Baru di WebGPU (Chrome Berikut 113)

François Beaufort
François Beaufort

Setelah bertahun-tahun pengembangan, tim Chrome mengumumkan bahwa rilis pertama WebGPU kini tersedia secara default di Chrome pada ChromeOS, macOS, dan Windows. Lihat Chrome mengirimkan WebGPU untuk mempelajari lebih lanjut.

Kami juga telah mulai menambahkan dokumentasi komprehensif untuk WebGPU di MDN.

Dan masih banyak lagi.

Menggunakan sumber VideoFrame WebCodecs di importExternalTexture()

WebGPU mengekspos API untuk membuat objek "tekstur eksternal" buram dari HTMLVideoElement hingga importExternalTexture(). Anda dapat menggunakan objek ini untuk mengambil sampel frame video secara efisien, mungkin dengan cara 0 salinan langsung dari data YUV sumber.

Namun, spesifikasi WebGPU awal tidak mengizinkan pembuatan objek GPUExternalTexture dari objek VideoFrame WebCodecs. Kemampuan ini penting untuk aplikasi pemrosesan video lanjutan yang sudah menggunakan WebCodecs dan ingin mengintegrasikan WebGPU dalam pipeline pemrosesan video. Diskusi saat ini sedang berlangsung di masalah gpuweb/gpuweb#1380.

Mengaktifkan fitur

Secara default, fitur ini tidak diaktifkan di Chrome, tetapi dapat diuji coba di Chrome 113 dengan mengaktifkan fungsinya secara eksplisit. Anda dapat mengaktifkannya secara lokal dengan mengaktifkan tanda "WebGPU Developer Features" di chrome://flags/#enable-webgpu-developer-features.

Untuk mengaktifkannya bagi semua pengunjung aplikasi Anda, uji coba origin saat ini sedang berlangsung dan akan berakhir di Chrome 118 (8 Desember 2023). Untuk berpartisipasi dalam uji coba, daftar dan sertakan elemen meta dengan token uji coba origin di header HTML atau HTTP. Untuk informasi selengkapnya, lihat postingan Memulai uji coba origin.

Kode contoh

// Access the GPU device.
const adapter = await navigator.gpu.requestAdapter();
const device = await adapter.requestDevice();

// Create VideoFrame from HTMLVideoElement.
const video = document.querySelector("video");
const videoFrame = new VideoFrame(video);

const texture = device.importExternalTexture({ source: videoFrame });
// TODO: Use texture in bind group creation.

Lihat contoh eksperimental Upload Video dengan WebCodecs untuk mencobanya.

Yang Baru di WebGPU

Daftar semua yang telah dibahas dalam seri Yang Baru di WebGPU.

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