Glsl webgl：绘制多个圆的最快方法
我现在画了数千个圆，实例化了许多三角形 或者，我可以简单地引用一个四边形2三角形，但使用距离函数在片段着色器中剪切出一个圆并丢弃Glsl webgl：绘制多个圆的最快方法,glsl,webgl,Glsl,Webgl,我现在画了数千个圆，实例化了许多三角形 或者，我可以简单地引用一个四边形2三角形，但使用距离函数在片段着色器中剪切出一个圆并丢弃 哪种方法更快绘制许多三角形是否比在片段着色器中进行的计算更昂贵？最快的方法可能取决于GPU和许多其他因素，如绘制圆的方式、2D、3D、是否混合圆、是否使用z缓冲区等。。。但一般来说，三角形越少，速度就越快，像素越少，速度就越快。所以，我们能做的就是尝试 首先，让我们只画没有混合纹理的四边形。首先，我似乎总是从WebGL获得不一致的性能，但在我在GPU上的测试中，我在这
哪种方法更快绘制许多三角形是否比在片段着色器中进行的计算更昂贵？最快的方法可能取决于GPU和许多其他因素，如绘制圆的方式、2D、3D、是否混合圆、是否使用z缓冲区等。。。但一般来说，三角形越少，速度就越快，像素越少，速度就越快。所以，我们能做的就是尝试 首先，让我们只画没有混合纹理的四边形。首先，我似乎总是从WebGL获得不一致的性能，但在我在GPU上的测试中，我在这个300x150画布上使用实例以60fps的速度获得了20k-30k四边形 主要功能{ const gl=document.querySelector'canvas.getContext'webgl'； const ext=gl.getExtension'ANGLE_instanced_array'； 如果！分机{ 返回警报“需要角度实例化数组”； } twgl.addExtensionsToContextgl； 常数vs=` 属性float-id； 属性向量4位置； 属性向量2 texcoord； 均匀浮动时间； 可变矢量2 v_texcoord； 可变的vec4 v_颜色； 真空总管{ 浮点数o=id+时间； gl_位置=位置+vec4 vec2 分形系数*0.1373， 分形系数*0.5127*2.0-1.0， 0, 0; v_texcoord=texcoord； v_color=vec4fractvec3id*vec30.127,0.373,0.513,1； }`; 常数fs=` 精密中泵浮子； 可变矢量2 v_texcoord； 可变的vec4 v_颜色； 均匀采样2d-tex； 真空总管{ gl_FragColor=纹理2dtex，v_texcoord*v_颜色； } `; //编译着色器、链接程序、查找位置 const programInfo=twgl.createProgramInfogl[vs，fs]； 常量最大计数=250000； const id=新的Float32ArraymaxCount； 对于let i=0；i