大家好，本文基于WebGPU的計算著色器實現了基礎的路徑追蹤器，支持Middle BVH和No BVH兩種加速結構

我主要是將離線渲染零基礎實戰開發培訓班（一期）->第二十九節課的代碼移植到WebGPU中，其中的原理可以看該課程

本文實現的代碼在這里

實現的功能

本文實現了下面的功能：

• no bvh or middle bvh
• path tracer
• direct light sample
• lambertian+specular material
• corner box scene

場景中的球和地板是specular material，完全鏡面反射；
墻是labertian material，漫反射

目前的性能是：

硬件（2015年的Mac Pro）：
Mac OS Big Sur 11.4操作系統
Chrome瀏覽器
Intel Iris Pro 1536 MB集成顯卡

FPS: 9

渲染結果：

目前遍歷BVH的性能還不到不用BVH的一半

不用BVH的遍歷是指直接遍歷所有的三角形的AABB；
BVH的遍歷是指先遍歷Top Level（BVH樹），然后再遍歷對應的BVH樹葉節點包含的Bottom Level（三角形的AABB）

遍歷BVH的性能主要在下面幾個方面提升：
1.盡量減少重疊的AABB
2.通過traverse order等方法來減少遍歷的BVH節點數量
3.減少顯存占用和IO

對于第二個方面，我已經使用了traverse order，即判斷ray和aabb相交的tMin如果大于intersectResult.t的話，則不再進入該AABB里繼續判斷相交了。
但這并沒有提升FPS，這是因為我使用的corner box場景簡單，本來AABB數量就少，所以這不是性能熱點

對于第一個方面，因為我使用的是最簡單的Middle BVH來構造的BVH樹，重疊的AABB很多。但這也不是主要的性能熱點，還是因為AABB數量少

主要的性能熱點應該在第三個方面，因為遍歷BVH需要使用Stack來保存節點，而每個線程（一個像素對應一個線程）都要在顯存中分配一個Stack的內存空間，并且不斷有進棧出棧操作，IO壓力也大

作為測試，我將Stack的深度降低后（Stack是一個數組，要預先固定深度，也就是設置固定的數組大小），FPS明顯提升

以前我實現過Ray Packet來優化這個方面，即一個線程組中的8*8個線程共享同一個Stack。
但是這只適合于Primary Ray的相交，次級射線的相交就不適合了，因為它們發射的方向很不一樣。
或許可以對次級射線進行排序，相似方向的射線為一組，然后每組就可以使用Ray Packet來實現共享同一個Stack。

下一步

實現下面的功能：

• 在path tracer中加入NRC：深度學習輻射亮度緩存優化
• 使用Instant Neural Graphics Primitives with a Multiresolution Hash Encoding來優化NRC