webgl速记之如何根据用户硬件进行性能模式OR质量模式的切换的设计思路

我遇到一个问题，我写了一份shader在不同的用户的机器上，会爆显存崩溃，我合成了几张巨大的纹理，一次上传，如果我分几个批次，就不会发生这个事情，然后性能就会相对下降

那么要处理这种事情，该怎么办，想了想，干脆就根据硬件级别来切换shader效果

var canvas = document.createElement('canvas');
var gl = canvas.getContext('webgl');

var renderer = gl.getParameter(gl.RENDERER);
undefined
renderer
'WebKit WebGL'
var ext = gl.getExtension('WEBGL_debug_renderer_info');

if (ext) {
  var vendor = gl.getParameter(ext.UNMASKED_VENDOR_WEBGL);
  var driver = gl.getParameter(ext.UNMASKED_RENDERER_WEBGL);

  console.log('厂商名称：', vendor);
  console.log('驱动程序版本：', driver);
}
输出
VM968:7 厂商名称： Google Inc. (Intel)
VM968:8 驱动程序版本： ANGLE (Intel, Intel(R) UHD Graphics 630 (0x00003E98) Direct3D11 vs_5_0 ps_5_0, D3D11)
VM63:14 厂商名称： Google Inc. (NVIDIA)
VM63:15 驱动程序版本： ANGLE (NVIDIA, NVIDIA GeForce RTX 3060 (0x00001E89) Direct3D11 vs_5_0 ps_5_0, D3D11)

webgl根据这个接口，还是能查看一点硬件信息的
我们根据读到的字符串，检索到NVIDIA之后，再检索20 30 40这些字眼，进行区分高端机还是打火机
当然，这样功能实现可能就要写几份，但没办法