WebGPU實現Ray Packet
- 2022 年 9 月 1 日
- 筆記
大家好~本文在如何用WebGPU流暢渲染百萬級2D物體？基礎上進行優化，使用WebGPU實現了Ray Packet，也就 …
Continue Reading
WebGPU的計算著色器實現冒泡排序
- 2022 年 8 月 12 日
- 筆記
大家好~本文使用WebGPU的計算著色器，實現了奇偶排序。 奇偶排序是冒泡排序的並行版本，在1996年由J Korner …
Continue Reading
如何用WebGPU流暢渲染千萬級2D物體：基於光線追蹤管線
- 2022 年 8 月 6 日
- 筆記
大家好~我們已經實現了百萬級2D物體的流暢渲染，不過是基於計算管線實現的。本文在它的基礎上，改為基於光線追蹤管線實現，主要進 …
Continue Reading
WebGPU 導入[2] – 核心概念與重要機制解讀
- 2022 年 8 月 2 日
- 筆記
目錄 1. 核心概念 ① 適配器和設備 ② 緩衝、紋理、取樣器 ③ 綁定組 ④ 著色器與管線 ⑤ 編碼器與隊列 2. 重 …
Continue Reading
如何用WebGPU流暢渲染百萬級2D物體？
- 2022 年 7 月 24 日
- 筆記
大家好~本文使用WebGPU和光線追蹤演算法，從0開始實現和逐步優化Demo，展示了從渲染500個2D物體都吃力到流暢渲染 …
Continue Reading
WebGPU 工具分享 – WGSL 程式碼高亮插件（VSCode）與預處理工具
- 2022 年 3 月 25 日
- 筆記
WGSL 還在積極討論中，雖然各位大佬不是很滿意這個新生兒。 不過，社區已經有了基礎的實驗性工具（VSCode 插件）， …
Continue Reading
WebGPU 計算管線、計算著色器（通用計算）入門案例：2D 物理模擬
- 2022 年 3 月 23 日
- 筆記
目錄 1. WebGL 2. WebGPU 2.1. 適配器（Adapter）和設備（Device） 2.2. 著色器（ …
Continue ReadingWebGL 與 WebGPU比對[6] – 紋理
- 2022 年 3 月 14 日
- 筆記
目錄 1. WebGL 中的紋理 1.1. 創建二維紋理與設置取樣參數 1.2. 紋理數據寫入與拷貝 1.3. 著色器中 …
Continue ReadingWebGL 與 WebGPU比對[5] – 渲染計算的過程
- 2022 年 2 月 28 日
- 筆記
目錄 1. WebGL 1.1. 使用 WebGLProgram 表示一個計算過程 1.2. WebGL 沒有通道 AP …
Continue ReadingWebGL 與 WebGPU比對[4] – Uniform
- 2022 年 2 月 19 日
- 筆記
目錄 1. WebGL 1.0 Uniform 1.1. 用 WebGLUniformLocation 定址 1.2. …
Continue Reading