Эта страница переведена с помощью Cloud Translation API.

Что нового в WebGPU (Chrome 113)

François Beaufort

После многих лет разработки команда Chrome объявляет, что первый релиз WebGPU теперь доступен по умолчанию в Chrome на ChromeOS, macOS и Windows. Ознакомьтесь с Chrome ships WebGPU , чтобы узнать больше.

Мы также начали добавлять подробную документацию по WebGPU на MDN.

И это еще не все.

Использовать источник WebCodecs `VideoFrame` в `importExternalTexture()`

WebGPU предоставляет API для создания непрозрачных объектов «внешней текстуры» из HTMLVideoElement через importExternalTexture() . Вы можете использовать эти объекты для эффективной выборки видеокадров, потенциально в режиме 0-копирования непосредственно из исходных данных YUV.

Однако первоначальная спецификация WebGPU не позволяет создавать объекты GPUExternalTexture из объектов WebCodecs VideoFrame . Эта возможность важна для расширенных приложений обработки видео, которые уже используют WebCodecs и хотели бы интегрировать WebGPU в конвейер обработки видео. Обсуждение в настоящее время происходит в выпуске gpuweb/gpuweb#1380 .

Включить функцию

По умолчанию эта функция не включена в Chrome, но с ней можно поэкспериментировать в Chrome 113, явно включив эту функциональность. Вы можете активировать ее локально, включив флаг "WebGPU Developer Features" на chrome://flags/#enable-webgpu-developer-features .

Чтобы включить его для всех посетителей вашего приложения, в настоящее время проводится пробная версия Origin , которая должна завершиться в Chrome 118 (8 декабря 2023 г.). Чтобы принять участие в пробной версии, зарегистрируйтесь и включите метаэлемент с токеном пробной версии Origin в заголовок HTML или HTTP. Для получения дополнительной информации см. публикацию Начало работы с пробными версиями Origin .

Пример кода

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

Ознакомьтесь с экспериментальным примером «Загрузка видео с помощью WebCodecs», чтобы поэкспериментировать с ним.