Bu sayfa, Cloud Translation API ile çevrilmiştir.

WebGPU'daki Yenilikler (Chrome 113)

François Beaufort

Yıllar süren geliştirme sürecinin ardından Chrome ekibi, WebGPU'nun ilk sürümünün artık ChromeOS, macOS ve Windows'daki Chrome'da varsayılan olarak kullanıma sunulduğunu duyurdu. Daha fazla bilgi edinmek için Chrome'un WebGPU yayını sayfasına göz atın.

Ayrıca MDN'ye WebGPU ile ilgili kapsamlı dokümanlar eklemeye başladık.

Ve dahası.

`importExternalTexture()` konumunda WebCodecs `VideoFrame` kaynağını kullan

WebGPU, opak "dış doku" oluşturmak için bir API sunar HTMLVideoElement ile importExternalTexture() arasındaki nesneler. Video karelerinden verimli bir şekilde örneklendirmek için bu nesneleri kullanabilirsiniz. Örnek olarak doğrudan kaynak YUV verilerinden 0 kopya yapabilirsiniz.

Ancak, ilk WebGPU spesifikasyonu WebCodecs VideoFrame nesnelerinden GPUExternalTexture nesnelerinin oluşturulmasına izin vermiyor. Bu özellik, halihazırda WebCodecs'i kullanan ve WebGPU'yu video işleme ardışık düzenine entegre etmek isteyen gelişmiş video işleme uygulamaları için önemlidir. Şu anda gpuweb/gpuweb#1380 sorunuyla ilgili tartışmalar devam etmektedir.

Özelliği etkinleştirme

Bu özellik Chrome'da varsayılan olarak etkin değildir, ancak Chrome 113'te bu işlev açıkça etkinleştirilerek denenebilir. "WebGPU Geliştirici Özellikleri"ni etkinleştirerek yerel olarak etkinleştirebilirsiniz. flag, chrome://flags/#enable-webgpu-developer-features adresine ekleyebilirsiniz.

Bu özelliği uygulamanızın tüm ziyaretçileri için etkinleştirmek üzere şu anda Chrome 118'de (8 Aralık 2023) sona erecek şekilde bir kaynak deneme süreci devam ediyor. Denemeye katılmak için kaydolun ve HTML veya HTTP başlığına kaynak deneme jetonunu içeren bir meta öğe ekleyin. Daha fazla bilgi için Kaynak denemelerini kullanmaya başlama başlıklı makaleyi inceleyin.

Örnek kod

// 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.

Denemek için WebCodecs ile Video Yükleme deneysel örneğine göz atın.