我们将 PIXI.js 用于内部使用 WebGL 进行渲染的游戏。时不时地，我偶然提到了二次幂和避免 NPOT 纹理可能带来的性能优势(https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Tutorial/使用_textures_in_WebGL#Non_power-of-two_textures，https://github.com/pixijs/pixi.js/blob/master/src/core/textures/BaseTexture.js#L116)。令人困惑的是，也有人提到它不再起作用(OpenGL - Power Of Two Textures)。随着 webgl 和浏览器的发展如此之快，很难判断这些信息中的哪一个是准确的。

我特别想知道填充图像以创建 POT 纹理的开销(更长的下载时间，增加的内存使用)是否值得性能优势(如果它们确实存在的话)。我找不到任何比较 POT 与 NPOT 纹理的比较或性能基准，遗憾的是我真的不知道如何自己创建一个。

有没有人有这方面的经验或一些最新的数字？有没有衡量 webgl 性能的好方法？

我认为您将得到的大多数答案是"取决于硬件/驱动程序/gpu"、"您必须自己测试"或"它不会慢很多(但需要注意的是，您必须测试所有gpus 以确保)".

与其担心将图像填充到 POT 中，不如使用纹理别名(sprite表)。或者请求 Pixi 背后的人来实现它。通过使用具有 POT 尺寸的纹理别名，您真正获得了两全其美：最小的填充浪费，保证 POT 纹理的执行速度不会比 NPOT 纹理慢，以及减少 GL 状态变化。

我无法强调通过减少 GL 状态更改可以获得多大的改进。通过实现纹理混叠和绘制批处理，我基本上可以在现实环境中绘制尽可能多的 2D sprite；也就是说以 60fps 的速度移动、旋转和调整 sprite 的大小约为 150k(受 CPU 约束，以每帧计算每个 sprite 的新变换)