实时渲染前沿研究:在浏览器上实现了Facebook提出的DLSS算法

大家好,我基于WebNN在浏览器上实现了2020年Facebook提出的Neural-Supersampling-for-Real-time-Rendering算法。它是一个用于实时渲染的神经网络超采样算法,能够把低分辨率的图片超采样为高分辨率的图片

本课程系列文章可进入合集查看:
实时渲染前沿研究系列文章合集

介绍DLSS算法整体思想

算法的整体介绍可参考:毫秒级时间使图像清晰16倍,Facebook提出的DLSS算法介绍

算法的pytorch实现请见:Github

介绍整体实现思路

1.使用pytorch实现训练,保存weight、bias
2.使用WebNN实现推理,读取weight、bias

实现的重点记录

1.后面需要加入Motion Vector input,并实现Backward Warp
2.zero upsampling的实现参考了:https://github.com/pytorch/pytorch/issues/7911#issuecomment-392835113
3.应该可以使用Typescript dependent type来实现Tensor维度的编译检查。不过目前没有完全实现
4.等webnn issue实现后,就可以直接获得MLOperand的dimensions了。这样可方便简化代码,如在builder.slice时直接获得dimensions

在浏览器上推理的结果

使用webgl后端,场景大小为180*120,推理后为720*480

耗时为:
2015年的macbook pro:6000ms

后续优化点

现在的主要问题是推理太慢了,可以从下面几个方面来加快速度:

  • 测试每个Module耗费的时间,找到性能热点

  • 减少推理中的数据拷贝,如减少builder.slice、builder.concat的使用

  • 减少previous frame的个数
    目前我用的是5个,可以减少为4个

  • 减半Reconstruction网络的参数

  • 等待WebNN成熟,从而可以使用WebGPU后端、甚至是硬件推理后端

改进方向

对颜色rgb进行处理

进入神经网络前先除以albedo;神经网络输出后再乘以它

可以结合Neural Supersampling for Real-time Rendering、High-Quality Supersampling via Mask-reinforced Deep Learning for Real-time Rendering论文提出的神经网络,从而获得16*4=64倍的像素提升!

具体方法是:
1.渲染512*256的1/4的像素(也就是256*128)
2.使用该论文提出的神经网络,将其超采样为512*256的分辨率
3.使用本文实现的DLSS算法的神经网络,再将其超采样为512*256*16的分辨率

不使用Motion Vector来做Backward Warp?

参考Fast Temporal Reprojection without Motion Vectors

移动端的改进

参考MNSS: Neural Supersampling Framework for Real-Time Rendering on Mobile Devices

posted @ 2023-06-24 11:42  杨元超  阅读(178)  评论(0编辑  收藏  举报