WebGPUで画面に■を表示する_函館市電LT

359 Views

October 14, 23

スライド概要

profile-image

札幌のウェブエンジニア

シェア

埋め込む »CMSなどでJSが使えない場合

関連スライド

各ページのテキスト
1.

WebGPUで画面に■を表示する 23.09.18 #函館市電LT 西村航 / @_n13u_

2.

自己紹介 西村航 / @_n13u_ 札幌から来ました

3.

昨日札幌でイベントやってました #MIKANTECHMEETUP テクノロジーをテーマに人が 集まりつつ、札幌でテック盛り上げようと いう趣旨のイベントでした

5.

イベントレポート執筆中

6.

#MIKANTECHMEETUP

7.

今日の話 みなさん知ってますか? WebGPU

8.

WebGPUとは? WebGPU は、ウェブアプリの GPU の機能にアクセスするための新しい 最新 API です。 https://codelabs.developers.google.com/your-first-webgp u-app?hl=ja#0

9.

グラフィックAPIについて GPUとおしゃべりするための専用の API。描画や特定の計算処理の反 復に特化

10.

Webで3DCG表現をするには OpenGL ES 3.0 ベースのWebGL https://codelabs.developers.google.com/your-first-webgp u-app?hl=ja#0

11.

Webで3DCG表現をするには

12.

WebGPUとは? 新しくて(機能が豊富)で早い(GPU に最適化されてる)Web標準で定め られてるWebGL後継ポジション的 な、グラフィックAPI https://ics.media/entry/230426/

13.

何が違う? WebGPUは、DirectXやVulkanの APIを叩きつつ、そこをうまく抽象化し てコードがかける

14.

触ってみた WebGPUなので、JavaScriptをしゃべり ます(Rustのwgpuとかもある) https://github.com/WataruNishimura/webgpu-handson

15.

触ってみた シェーダ言語はHLSLでもGLSLでもな く、WGSL(!?) https://github.com/WataruNishimura/webgpu-handson

16.

触ってみた TypeScriptの型定義ファイル @webgpu/types を使うと開発者体験が かなりいいです。(APIのクラスとか BufferArrayとかtypoしたときにすぐわか る) https://github.com/WataruNishimura/webgpu-handson

17.

GitHubありますGitHub.ioあります https://github.com/WataruNishimura/webgpu-handson https://watarunishimura.github.io/webgpu-handson

18.

すぺしゃるさんくす @tomio2480 さんのご協力に より格安で函館これました

19.

ありがとうございました