现代 WebGL 的二次幂纹理性能优势
Power-of-two textures performance benefits with modern WebGL
我们将 PIXI.js 用于内部使用 WebGL 进行渲染的游戏。我时不时地遇到关于二次幂和避免 NPOT 纹理可能带来的性能优势的提及 (https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL#Non_power-of-two_textures, https://github.com/pixijs/pixi.js/blob/master/src/core/textures/BaseTexture.js#L116). Confusingly there are also mentions that it doesn't make a difference anymore (OpenGL - Power Of Two Textures)。随着 webgl 和浏览器的发展如此之快，很难判断这些信息中的哪些是准确的。
具体来说，我想知道填充图像以创建 POT 纹理的开销（更长的下载时间、增加的内存使用量）是否值得性能优势（如果它们确实存在）。我找不到任何比较 POT 和 NPOT 纹理的比较或性能基准，遗憾的是我真的不知道如何自己创建一个。
有没有人有这方面的经验或一些最新的数字？是否有衡量 webgl 性能的好方法？
我认为您将得到的大部分答案是 "depends on hardware/driver/gpu"、"you have to test it yourself" 或 "it wouldnt be much slower (but with caveat you have to test across all gpus to make sure)"。
与其担心将图像填充到 POT，不如使用纹理别名（精灵 sheet）。或者请Pixi背后的人来实现。通过使用具有 POT 维度的纹理别名，您真正获得了两全其美：最小的填充浪费，保证 POT 纹理将执行 不慢 比 NPOT 纹理， AND 减少 GL 状态变化。
我无法强调通过减少 GL 状态更改可以获得多大的改进。通过实现纹理别名和绘制批处理，我基本上可以在真实环境中绘制尽可能多的 2D 精灵；即 ~150k 以 60fps 的速度移动、旋转和调整精灵大小（受 CPU 约束以计算每帧每个精灵的新变换）
我们将 PIXI.js 用于内部使用 WebGL 进行渲染的游戏。我时不时地遇到关于二次幂和避免 NPOT 纹理可能带来的性能优势的提及 (https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/Using_textures_in_WebGL#Non_power-of-two_textures, https://github.com/pixijs/pixi.js/blob/master/src/core/textures/BaseTexture.js#L116). Confusingly there are also mentions that it doesn't make a difference anymore (OpenGL - Power Of Two Textures)。随着 webgl 和浏览器的发展如此之快，很难判断这些信息中的哪些是准确的。
具体来说，我想知道填充图像以创建 POT 纹理的开销（更长的下载时间、增加的内存使用量）是否值得性能优势（如果它们确实存在）。我找不到任何比较 POT 和 NPOT 纹理的比较或性能基准，遗憾的是我真的不知道如何自己创建一个。
有没有人有这方面的经验或一些最新的数字？是否有衡量 webgl 性能的好方法？
我认为您将得到的大部分答案是 "depends on hardware/driver/gpu"、"you have to test it yourself" 或 "it wouldnt be much slower (but with caveat you have to test across all gpus to make sure)"。
与其担心将图像填充到 POT，不如使用纹理别名（精灵 sheet）。或者请Pixi背后的人来实现。通过使用具有 POT 维度的纹理别名，您真正获得了两全其美：最小的填充浪费，保证 POT 纹理将执行 不慢 比 NPOT 纹理， AND 减少 GL 状态变化。
我无法强调通过减少 GL 状态更改可以获得多大的改进。通过实现纹理别名和绘制批处理，我基本上可以在真实环境中绘制尽可能多的 2D 精灵；即 ~150k 以 60fps 的速度移动、旋转和调整精灵大小（受 CPU 约束以计算每帧每个精灵的新变换）