volumeshader_bm 是一款基于浏览器的 GPU 性能测试工具，在抖音上火过一阵。说白了，就是打开网页，看一个旋转的彩色球体，帧率高说明你设备图形性能还行，帧率低就说明扛不住。
它不需要下载安装，直接通过浏览器访问就能用。适合想快速了解自己手机或电脑 GPU 实际表现的普通用户，不用跑那些复杂的跑分软件。
1. 实时 GPU 压力测试——打开页面后自动渲染一个曼德尔布集（Mandelbulb）三维图形，持续进行体积着色运算，直接压榨 GPU 算力。帧率数据实时显示在页面上。
2. 帧率直观反馈——不用看什么跑分数字，画面卡不卡、转得顺不顺，肉眼就能判断。帧率掉到个位数基本就是设备到极限了。
3. 着色器参数可调——点击左侧 "config" 按钮，能打开配置页面，查看图形体积着色数据。点 "apply" 开启编辑权限后，可以手动输入代码调整渲染质量，想测极限就拉高，想流畅就拉低。
4. 零安装使用——基于 WebGL 2.0 技术，全程在浏览器里跑。不用下载、不用注册、不用给权限，打开链接就开始测。
1. 测试方式极简——传统 GPU 测试工具要么要装客户端，要么要跑十几分钟。这个打开网页就出结果，30 秒内就能知道设备大概什么水平。
2. 渲染算法有门槛——它用的是实时计算的曼德尔布集，涉及反三角函数和除法运算。所以别觉得简单，就算是高端显卡也可能跑不满帧率，手机就更别想了。测试上限够高，能拉开设备差距。
3. 跨平台通用——手机、平板、电脑，只要有支持 WebGL 2.0 的浏览器就能测。不用区分系统版本，一个链接全搞定。
4. 体积极小——整个测试页面也就 10MB 左右，不占存储空间，不后台运行，测完关掉就完事。
点击左侧“config”可打开配置详情
代码列表框中，我们可清晰明了的查阅图形体积的着色情况和详细数据
点击其中的“apply”可开启编辑权限，在文本框中输入代码数据，提高或降低着色器的显示质量
控制体积材质（如灯光雾）的颜色、透明度和蒙版不透明度。通过该着色器，可以直接将其他属性和效果与材质的颜色、透明度和蒙版不透明度相连。“体积着色器”（Volume Shader）可用于“聚光灯”（Spot Light）、“点光源”（Point Light）、“环境雾”（Environment Fog）和“粒子”（particles）。
在创建栏中查找该材质。
输出颜色（Out Color）
定义材质的输出颜色。默认颜色为黑色。
输出透明度（Out Transparency）
设定材质的输出“透明度”（Transparency）。默认颜色为黑色（不透明）。
1、当你进入页面时，你会看到一个五颜六色的不规则球形物体不断旋转。同时你会发现你用的设备变得极其古怪，帧数直接降到个位数。
2、网页上显示的图像是实时计算的旋转曼德尔布。当前版本（volumeshader_bm）有固定的渲染分辨率，其帧数只取决于gpu的性能。但是因为反三角函数和除法，别说手机了，一般电脑的显卡也不一定能让它流畅运行。
3、由于画面不是静态的，反馈画面需要每秒计算一次，性能不足的设备卡顿也是可以理解的。
注意：使用该网页的时候部分手机会出现延迟卡顿的现象，建议先清理手机达到最佳状态在进行测试。
1. 修复了部分安卓机型在 Chrome 内核浏览器中打开页面白屏的问题，主要是 WebGL 上下文初始化失败导致的。
2. 优化了帧率统计逻辑，之前偶发出现帧率显示为 0 的情况，现在改为滑动窗口平均值，数据更稳定。
3. config 面板里新增了当前渲染分辨率的显示，方便用户确认实际输出分辨率是否被浏览器缩放。
4. 调整了默认渲染精度，之前默认参数对低端设备太不友好，现在默认值稍微降了一档，至少能出画面再慢慢调。
