Посмотрел доклад с прошедшего Google I/O'19 "Next-Generation 3D Graphics on the Web" про настоящее и будущее 3D-графики в Web'е.
Из первой части доклада запомнилось использование веб-компонентов для снижения сложности кода при использовании WebGL-фич. Вот так выглядит пример вставки просмотрщика 3D-моделей на страницу:
Вторая часть доклада для меня была самой интересной. Она была посвящена новому API — WebGPU. Показали демо, где на сцене рендерилось 10000 объектов. Всё работало довольно производительно (~40fps). WebGPU способен отправить в три раза больше команд на отрисовку относительно WebGL.
Рассказали про то, что с помощью WebGPU теперь можно эффективнее работать с фильтрами пост-процессинга и алгоритмами машинного обучения, так как WebGPU гораздо гибче чем WebGL — он позволяет работать с разделяемой памятью GPU. Это также открывает возможность вынесения симуляции жидкости, скиннинга, параллельной сортировки и других алгоритмов с CPU на GPU.
Новое API доступно пока в Chrome Canary на macOS в экспериментальном режиме. API включается с помощью флага chrome://flags/#enable-unsafe-webgpu. Над новой спецификацией работают производители всех браузеров.
#talk #webgl #webgpu
https://www.youtube.com/watch?v=K2JzIUIHIhc
Из первой части доклада запомнилось использование веб-компонентов для снижения сложности кода при использовании WebGL-фич. Вот так выглядит пример вставки просмотрщика 3D-моделей на страницу:
// импорт библиотеки
<script type="module" src="model-viewer.js"></script>
// добавление просмотрщика на страницу
<model-viewer src="astronaut.glb"></model-viewer>
Вторая часть доклада для меня была самой интересной. Она была посвящена новому API — WebGPU. Показали демо, где на сцене рендерилось 10000 объектов. Всё работало довольно производительно (~40fps). WebGPU способен отправить в три раза больше команд на отрисовку относительно WebGL.
Рассказали про то, что с помощью WebGPU теперь можно эффективнее работать с фильтрами пост-процессинга и алгоритмами машинного обучения, так как WebGPU гораздо гибче чем WebGL — он позволяет работать с разделяемой памятью GPU. Это также открывает возможность вынесения симуляции жидкости, скиннинга, параллельной сортировки и других алгоритмов с CPU на GPU.
Новое API доступно пока в Chrome Canary на macOS в экспериментальном режиме. API включается с помощью флага chrome://flags/#enable-unsafe-webgpu. Над новой спецификацией работают производители всех браузеров.
#talk #webgl #webgpu
https://www.youtube.com/watch?v=K2JzIUIHIhc
YouTube
Next-Generation 3D Graphics on the Web (Google I/O ’19)
This talk will cover the latest updates for adding 3D to your web site. You'll learn how to use model-viewer and new features for rendering, AR, and interactivity. You'll also see some phenomenal sites created with three.js. Then you'll get an overview of…
Франсуа Бофор из Google написал туториал про использование GPU-вычисления в web'е — "Get started with GPU Compute on the Web".
Возможности для GPU-вычислений предоставляет разрабатываемый стандарт WebGPU. Благодаря этому стандарту из web-приложений будут доступны все возможности современных видеокарт. После появления полноценной поддержки API в браузерах, наибольшую пользу получат те приложения, основная задача которых сводится к выполнению однотипных операций на большом количестве данных (например, приложения, использующие алгоритмы машинного обучения).
В статье очень подробно разбирается пример реализации умножения матриц. Объясняются понятия command encoder, bind group, bind group layout. Разбирается шейдер для перемножения матриц. Шейдеры пишутся на языке GLSL (в будущих версиях стандарта язык может поменяться).
Туториал хороший. Рекомендую посмотреть.
#webgpu #future
https://developers.google.com/web/updates/2019/08/get-started-with-gpu-compute-on-the-web
Возможности для GPU-вычислений предоставляет разрабатываемый стандарт WebGPU. Благодаря этому стандарту из web-приложений будут доступны все возможности современных видеокарт. После появления полноценной поддержки API в браузерах, наибольшую пользу получат те приложения, основная задача которых сводится к выполнению однотипных операций на большом количестве данных (например, приложения, использующие алгоритмы машинного обучения).
В статье очень подробно разбирается пример реализации умножения матриц. Объясняются понятия command encoder, bind group, bind group layout. Разбирается шейдер для перемножения матриц. Шейдеры пишутся на языке GLSL (в будущих версиях стандарта язык может поменяться).
Туториал хороший. Рекомендую посмотреть.
#webgpu #future
https://developers.google.com/web/updates/2019/08/get-started-with-gpu-compute-on-the-web
Chrome for Developers
Get started with GPU Compute on the web | Capabilities | Chrome for Developers
This post explores the experimental WebGPU API through examples and helps you get started with performing data-parallel computations using the GPU.
В блоге WebKit около двух недель назад появилась статья про статус поддержки WebGPU API в Safari — "WebGPU and WSL in Safari".
Железо и архитектура видеокарт постоянно улучшается. Одновременно с их развитием появляются новые программные API, которые умеют c ними эффективного работать. На сегодняшний день есть Direct3D 12 от Microsoft, Metal от Apple и Vulkan от Khronos Group. Эти API работают на более низком уровне абстракции по сравнению с OpenGL, поэтому они более производительны. Проблема в том, что они не доступны на всех платформах, то есть не могут быть использованы для web'а. Для того чтобы решить эту проблему, разрабатывается новый стандарт для работы с видеокартами — WebGPU.
WebGPU предоставляет набор JavaScript API, с помощью которого рендеринг объектов отделяется от процесса их валидации, тем самым предоставляя разработчикам возможность эффективного управления процессом рендеринга. В статье есть график результатов синтетического бенчмарка. Там видно, что прирост производительность по сравнению с WebGL может увеличиться до семи раз. Есть планы по поддержке WebGPU API из WebAssembly в будущем. В статье ещё немного рассказывается про Web Shading Language (WSL) — новый язык шейдеров, поддержка которого появилась в Safari TP 91. Его основная особенность в том, что он создавался с нуля для поддержки всех платформ и графических API, которые поддерживает WebGPU.
Мне лично непонятно, какая судьба будет у WebGL 2.0. С учётом того, что в разработку WebGPU активно инвестирует Apple, есть риск, что поддержка WebGL 2.0 в Safari так и останется на экспериментальном уровне.
Статью стоит почитать, если вам интересно, как развиваются API для работы с видеокартами.
#webgpu #experimental #safari
https://webkit.org/blog/9528/webgpu-and-wsl-in-safari/
Железо и архитектура видеокарт постоянно улучшается. Одновременно с их развитием появляются новые программные API, которые умеют c ними эффективного работать. На сегодняшний день есть Direct3D 12 от Microsoft, Metal от Apple и Vulkan от Khronos Group. Эти API работают на более низком уровне абстракции по сравнению с OpenGL, поэтому они более производительны. Проблема в том, что они не доступны на всех платформах, то есть не могут быть использованы для web'а. Для того чтобы решить эту проблему, разрабатывается новый стандарт для работы с видеокартами — WebGPU.
WebGPU предоставляет набор JavaScript API, с помощью которого рендеринг объектов отделяется от процесса их валидации, тем самым предоставляя разработчикам возможность эффективного управления процессом рендеринга. В статье есть график результатов синтетического бенчмарка. Там видно, что прирост производительность по сравнению с WebGL может увеличиться до семи раз. Есть планы по поддержке WebGPU API из WebAssembly в будущем. В статье ещё немного рассказывается про Web Shading Language (WSL) — новый язык шейдеров, поддержка которого появилась в Safari TP 91. Его основная особенность в том, что он создавался с нуля для поддержки всех платформ и графических API, которые поддерживает WebGPU.
Мне лично непонятно, какая судьба будет у WebGL 2.0. С учётом того, что в разработку WebGPU активно инвестирует Apple, есть риск, что поддержка WebGL 2.0 в Safari так и останется на экспериментальном уровне.
Статью стоит почитать, если вам интересно, как развиваются API для работы с видеокартами.
#webgpu #experimental #safari
https://webkit.org/blog/9528/webgpu-and-wsl-in-safari/
WebKit
WebGPU and WSL in Safari
WebGPU is a new API being developed by Apple and others in the W3C which enables high-performance 3D graphics and data-parallel computation on the Web.
Дмитрий Малышев из команды Firefox написал пост-апдейт про текущий статус разработки WebGPU — нового API для работы с видеокартами — "A Taste of WebGPU in Firefox".
Возможности WebGL не позволяют утилизировать весь потенциал современных видеокарт. Решить эту проблему призвано новое WebGPU API, над которым работают инженеры всех основных браузеров.
WebGPU предоставляет собой абстракцию над графическими API (DirectX12, Vulkan, Metal), изменяя подход к написанию приложений, которые используют вычислительные ресурсы видеокарт. Его основное отличие от WebGL — предоставление разработчикам большего количества рычагов для планирования и управления вычислениями. Например, благодаря ему можно распараллелить ресурсоёмкие задачи в web-воркерах, эффективно задействуя многоядерные процессоры. Или переиспользовать пакеты команд рендеринга, что открывает возможность портирования игр с открытым миром на web-платформу.
На данный момент рабочая группа WebGPU решила большую часть архитектурных проблем. Окончание основных работ над спецификацией и её имплементацией в браузерах планируется на конец 2020 года.
#webgl #webgpu #future
https://hacks.mozilla.org/2020/04/experimental-webgpu-in-firefox/
Возможности WebGL не позволяют утилизировать весь потенциал современных видеокарт. Решить эту проблему призвано новое WebGPU API, над которым работают инженеры всех основных браузеров.
WebGPU предоставляет собой абстракцию над графическими API (DirectX12, Vulkan, Metal), изменяя подход к написанию приложений, которые используют вычислительные ресурсы видеокарт. Его основное отличие от WebGL — предоставление разработчикам большего количества рычагов для планирования и управления вычислениями. Например, благодаря ему можно распараллелить ресурсоёмкие задачи в web-воркерах, эффективно задействуя многоядерные процессоры. Или переиспользовать пакеты команд рендеринга, что открывает возможность портирования игр с открытым миром на web-платформу.
На данный момент рабочая группа WebGPU решила большую часть архитектурных проблем. Окончание основных работ над спецификацией и её имплементацией в браузерах планируется на конец 2020 года.
#webgl #webgpu #future
https://hacks.mozilla.org/2020/04/experimental-webgpu-in-firefox/
Mozilla Hacks – the Web developer blog
A Taste of WebGPU in Firefox
WebGPU is an emerging API, designed from the ground up within the W3C, to provide access to the graphics and computing capabilities of hardware on the web.
Сравнение вычислительной производительности WebGL и WebGPU
Денис Радин сравнил вычислительную производительность WebGL и WebGPU — "WebGPU computations performance in comparison to WebGL".
WebGPU API предоставляет доступ к возможностям современных видеокарт. Для поддержки вычислений в нём используются вычислительные шейдеры (compute shaders). В WebGL что-то подобное можно сделать с помощью хака преобразованием данных в текстуру и их дальнейшей обработкой с помощью пиксельного шейдера. Так как WebGPU разрабатывался с учётом поддержки произвольных вычислений, в задаче на перемножение матриц он работает в 3,5 раза быстрее WebGL.
WebGPU открывает доступ к машинному обучению в вебе, пост-процессингу в реальном времени и физическим симуляциям в 60 fps.
#webgl #webgpu #performance
https://pixelscommander.com/javascript/webgpu-computations-performance-in-comparison-to-webgl/
http://pixelscommander.com/ru/javascript/webgpu-computations-performance-in-comparison-to-webgl/ (на русском языке)
Денис Радин сравнил вычислительную производительность WebGL и WebGPU — "WebGPU computations performance in comparison to WebGL".
WebGPU API предоставляет доступ к возможностям современных видеокарт. Для поддержки вычислений в нём используются вычислительные шейдеры (compute shaders). В WebGL что-то подобное можно сделать с помощью хака преобразованием данных в текстуру и их дальнейшей обработкой с помощью пиксельного шейдера. Так как WebGPU разрабатывался с учётом поддержки произвольных вычислений, в задаче на перемножение матриц он работает в 3,5 раза быстрее WebGL.
WebGPU открывает доступ к машинному обучению в вебе, пост-процессингу в реальном времени и физическим симуляциям в 60 fps.
#webgl #webgpu #performance
https://pixelscommander.com/javascript/webgpu-computations-performance-in-comparison-to-webgl/
http://pixelscommander.com/ru/javascript/webgpu-computations-performance-in-comparison-to-webgl/ (на русском языке)