webgpu-renderer & path-tracing
A simple renderer implemented by WebGPU, includes a builtin path tracing pipeline.
Path tracing demo
Check here: Path tracing demo
You must use the lasted version of Chrome.
Development
First clone this repository, the:
npm i
npm run dev
Then open url http://127.0.0.1:8888
in your chrome canary.
Tutorials
Chinese only now.
- 概览介绍:将会对整个项目涉及的知识做一个综述。
- WebGPU基础与简单渲染器:通过自己实现的一个简单渲染器来论述WebGPU的能力。
- 路径追踪-场景数据组织:针对路径追踪,如何组织场景数据,涉及到PBR材质、glTF、场景合并等。
- 路径追踪-管线组织与GBuffer:针对路径追踪,如何组织渲染管线,同时论述GBuffer的生成。
- 路径追踪-BVH与射线场景求交插值:如何构建BVH,以及如何在CS中求交。
- 路径追踪-BRDF与蒙特卡洛积分:论述如何在路径追踪中运用蒙特卡洛采样实现直接光照和间接光照,以及运用BRDF光照模型。
- 路径追踪-降噪与色调映射:如何对充满噪点的图像进行空间和时间的滤波,最后输出如何进行色调映射。
- 踩坑与调试心得:对于WebGPU这样一个实验性的API(至少当时),我是如何进行调试的血泪史(主要是CS部分)。
License
Copyright © 2021, 戴天宇, Tianyu Dai (dtysky < [email protected] >). All Rights Reserved. This project is free software and released under the MIT License.