opengl/webgl的性能优化

      1. 避免在shader中做逻辑判断,比如if else。

      有的人可能会很疑惑,为何要这样?这和GPU的基本调度有关系,GPU的基本调度单位叫做wavefront, 就是指一组完全相同的计算指令,在GPU的几个计算单元中并行执行,每一个指令的输入数据不同而已。这样并行度很高,可以极大程度提高性能。但是一旦引入if else,就会把wavefront破坏掉,比如现在有10个计算单元在并发执行,但是碰到if,在5个计算单元中为true, 在5个计算单元中为false, 这样会造成新的计算指令,那么之前的并行运算将无法继续。新的计算指令需要排队等待执行,或者新的指令要转移到新的计算单元上,这个过程涉及到数据的复制转移,会比较耗时,会严重破坏并行度。

     但是有些场景下,shader中完全不用逻辑判断又不行,那该如何呢?可以考虑使用shader的内置函数,比如step函数,案例如下:

    float a;

    if(b >1){

        a = 1;

    }else{

       a = 0.5;

    }

    可以优化为:

    float a;

    float temp = step(b, 1);

    a = temp * 0.5 + (1 - temp);

    2. 减少三角形数量

    较少三角形的数量大体上可以从以下几个角度入手:

    (1). 空间分割技术:包括八叉树,四叉树做空间分割,将不在当前可视区域物体剔除掉

    (2). 遮挡检测技术:视锥体范围内,有些物体会被前面的物体遮挡,这些被遮挡的物体其实是不需要渲染的。遮挡查询有多种技术方案实现,比如通过扩扑性,硬件遮挡查询。扩扑性比较麻烦,我这里推荐硬件遮挡查询技术,实现起来相对比较容易。

   (3). LOD技术:根据物体距离摄像头的距离,动态调节物体三角形的数量。

   (4). 图元类型的优化:使用GL_TRIANGLE_FAN或者GL_TRIANGLE_STRIP替代GL_TRIANGLES,因为这样可以重用顶点,减少三角形的数量。

   (5). 使用顶点索引的方法做渲染:使用glDrawElements替代glDrawArrays,因为前者通过索引的方式可以减少三角形的数量。

    3. 纹理的优化

    (1). 纹理的长宽最好是2的幂。

    (2). 纹理压缩:纹理压缩在opengl es 3.0和webgl 2.0上有比较好的支持,经压缩后的纹理可以减少图形数据,节省宽带。常见的压缩格式为ETC,Khronos公司提供有ETC格式压缩的免费压缩包,在opengl/webgl程序中使用glCompressedTexImage2D函数加载被压缩的纹理。

   (3). 纹理的上传:传统的纹理上传比较耗时,可以考虑使用两个PBO上传纹理,性能会有较大的提升。

   (4). 纹理的合成:如果有很多个小的纹理,每一个纹理单独加载,效率比较低下。可以考虑将多个小纹理合成到一个纹理上,仅仅加载一次,然后在程序中使用的时候,使用不同的纹理坐标范围来加载不同的纹理。   

    4. 减少系统内存向GPU内存传送数据的次数

    具体可以从如下方面入手:

    (1). 尽可能使用VBO/VAO

    (2). 在opengl es 3.0/webgl 2.0上可以使用Transform Feedback, 该方案可以使用GPU做通用运算,把计算的结果存入VBO中,在后期的渲染流程中使用该VBO作为输入。

    (3). 批次合并:比如一个最小包围体内有多个物体,可以将这些物体的三角形合并在一起,一次性的发送到GPU。

    (4). 使用instance: 如果要渲染多个重复的物体,可以使用instance特性。

    5. 针对在复杂计算的优化:

    (1). 使用延迟着色:针对在片段着色器中有复杂计算,并且很多顶点不能通过深度测试的场景,延迟着色可以很大程度上提高渲染性能。

    (2). 开启多个渲染线程: 每个渲染线程的viewPort设置为屏幕的一个区域,可以充分利用CPU和GPU

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页