WebGL2系列之不可变纹理

xinhaip 发布于2019-08-22 13:55 / 531人阅读

摘要：除此之外，还可以通过函数独立指定纹理的每个的级别。这种绘图时检查可能代价很高，而使用不可变纹理可以避免这种情形。不可变纹理使用不可变纹理，可以减少上文中提到的因检查而导致的性能开销。不可变纹理指的是纹理的一种分配方式，而不是值纹理的内容。

纹理背景知识

在WebGL1中，纹理包括2D纹理和立方体纹理，在实际的使用中，如果纹理的图片是宽和高是2的幂，可以自动生成纹理的mipmap。
除此之外，还可以通过gl.texImage2D函数独立指定纹理的每个mipmap的级别。
因此，这会导致一个一般的编程人员不易觉察的问题，这涉及到显卡底层驱动。
简单来说，就是会导致驱动程序无法在绘图之前确定纹理是否完全指定，因此它必须检查每一个mip贴图级别或者子图像的格式是否相符、每一个级别的大小是否正确以及是否有足够的内存。这种绘图时检查可能代价很高，而使用不可变纹理可以避免这种情形。

不可变纹理

使用不可变纹理，可以减少上文中提到的因检查而导致的性能开销。不可变纹理指的是纹理的一种分配方式，而不是值纹理的内容。
不可变纹理的思路是：在给纹理加载纹理数据之前，先指定纹理的格式和大小，显卡驱动程序可以提前进行一致性、内存的检查，一旦指定了纹理的格式和大小之后，纹理的格式和尺寸就不能更改，但是可以通过gl.texSubImage2D、texSubImage3D（注意不能用gl.txtImage2D）等方法来加载纹理的数据，同时还可以使用such as render-to-texture, mipmap generation等方式加载纹理数据。

texSubImage3D(以及后面提到的texStorage3D)方法与3D纹理有关，后续相关文章会介绍。

创建不可变纹理

创建不可变纹理很简单，首先通过gl.bindTexture方法绑定纹理对象，然后通过调用gl. texStorage2D、texStorage3D指定纹理的大小和格式，来创建不可变的存储空间。代码如下：

  // -- Allocate storage for the texture
 gl.texStorage2D(gl.TEXTURE_2D, 1, gl.RGB8, 512, 512);
 gl.texSubImage2D(gl.TEXTURE_2D, 0, 0, 0, gl.RGB, gl.UNSIGNED_BYTE, image);
 gl.generateMipmap(gl.TEXTURE_2D);

不可变纹理可以优化性能

在很多情况下，我们的纹理的尺寸和数据格式都是不需要改变的。使用不可变纹理，可以避免驱动程序对这些不需要改变的尺寸和数据格式的纹理对象进行一致性和内存大小的检查，因此可以获得更佳的性能。

案例：使用不可变纹理

暂无

后记

本节只讲述了2D的不可变纹理，3D的不可变纹理类似，在将3D纹理的时候会进一步讲述。

服务器托管云服务器纹理单元纹理引用纹理 android 纹理映射

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/92612.html

WebGL2系列之不可变纹理

摘要：除此之外，还可以通过函数独立指定纹理的每个的级别。这种绘图时检查可能代价很高，而使用不可变纹理可以避免这种情形。不可变纹理使用不可变纹理，可以减少上文中提到的因检查而导致的性能开销。不可变纹理指的是纹理的一种分配方式，而不是值纹理的内容。纹理背景知识在WebGL1中，纹理包括2D纹理和立方体纹理，在实际的使用中，如果纹理的图片是宽和高是2的幂，可以自动生成纹理的mipmap。除此之...

XUI 2019-08-05 12:49 评论0 收藏0
WebGL2系列之引言

摘要：本系列文章将会向读者展示开发与的区别和的一些重要的新特性进行介绍本系列文章面向已经熟悉的读者，如果你还不熟悉，可以考虑阅读的相关书籍。菜已陆续上桌，我们开动吧。引子时光荏苒岁月如梭，不知不觉间，青丝变白发，哦不是，应该是WebGL已经发展到了2.0阶段:WebGL2，WebGL2相比WebGL增加了很多新的特性，这些新的特性能够帮助程序开发人员实现更多更酷更炫更高性能的Web...

chadLi 2019-08-05 17:58 评论0 收藏0
WebGL2系列之多采样渲染缓冲对象

摘要：在很久很久以前，使用的时候，只能在默认的绘制的缓冲区上面使用，而不能在帧缓冲区上面实现，更加形象的说就是不能用于离屏渲染。下面是该函数的签名该函数的作用就是，把一个帧缓冲区上的指定区域像素转移给另外一个帧缓冲区上的指定区域。在很久很久以前，盘古开辟了天地，他的头顶着天，脚踩着地，最后他挂了。他的毛发变成了森林，他的血液变成了河流，他的肌肉变成了大地。。。。。。卡！哦，不对，在很久很...

vpants 2019-08-23 18:41 评论0 收藏0
WebGL2系列之图元重启

摘要：在中，可以通过图元重启的特性来解决这个问题。图元重启可以绘制分散的三角形或者线段。代码片段下面的代码，在定义的数组中加入了图元重启标志背景在使用WebGL绘制图形的时候，大多数情况下，绘制一个图形的时候，其各个图元都是相连的。但是在一些情况下，我们需要绘制图元不相连的图形，如果绘制的模式是gl.TRAINGLES或者gl.LINES，也是可以达到的，但是如果绘制的模式是gl.TR...

mj 2019-08-05 12:31 评论0 收藏0
WebGL2系列之顶点数组对象

摘要：提供了一种专门用于解决此问题的对象顶点数组对象。本节将介绍顶点数组对象。顶点数组对象顶点数组对象是这样一种对象它封装了与顶点处理器有关的所有数据，它记录了顶点缓存区和索引缓冲区的引用，以及顶点的各种属性的布局而不是实际的数据。使用了顶点缓冲技术后，绘制效率有了较大的提升。但是还有一点不尽如人意，那就是顶点的位置坐标、法向量、纹理坐标等不同方面的数据每次使用时需要单独指定，重复了一些不...

Ashin 2019-08-05 12:29 评论0 收藏0