WebGLTextures: Use gl.texStorage2D() with compressed textures.

[Mugen87]

Related issue: see #22790 (comment) and #21874

Description

Introduces the usage of gl.texStorage2D() with compressed textures.

[Mugen87]

Merging for further testing.

[mrdoob]

Thanks!

[donmccurdy]

@Mugen87 I'm seeing a problem introduced by this PR when testing our webgl / loader / texture / ktx2 example in Safari:

In Safari we select ETC1 as the transcode target. In Chrome and Firefox ETC1 is not supported on my device so we select DXT instead, and the problem doesn't occur. None of these browsers are exposing as many compressed formats as they should, and hopefully that will be improved in upcoming browser updates (see issues below). But the browser support is probably a moot point for now – we currently support devices that can only handle ETC1, and dropping that support is not something we should do by accident.

• KTX2Loader may skip alpha when transcoding to ETC1 #22899
• https://bugs.webkit.org/show_bug.cgi?id=233817

glCompressedTexSubimage2d supports ETC2 textures but not ETC1. Only WEBGL_compressed_texture_etc1 is available but it needs WEBGL_compressed_texture_etc.

• https://stackoverflow.com/q/41169151/1314762
• https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/compressedTexSubImage2D#parameters

[Mugen87]

In Safari we select ETC1 as the transcode target.

Does this selection depend on the type of the WebGL rendering context? Would it be possible to select a different texture compression format when Safari supports WebGL 2?

So when using gl.texStorage2D() ETC1 is not supported and thus loaders should not select it as format. Maybe we could establish a policy that requires the usage WebGL1Renderer if users rely on ETC1?

[donmccurdy]

It's based on the available WebGL extensions. At least on my device those are consistent between WebGL 1 and WebGL 2:

//  Safari (macOS 12, M1 Pro)
EXT_texture_compression_rgtc
WEBGL_compressed_texture_etc1
WEBGL_compressed_texture_s3tc
WEBGL_compressed_texture_s3tc_srgb

//  Chrome, Firefox (macOS 12, M1 Pro)
EXT_texture_compression_rgtc
WEBGL_compressed_texture_s3tc
WEBGL_compressed_texture_s3tc_srgb

I haven't tested this myself, but once ANGLE/Metal is enabled the device should be able to support the following in any of the browsers above:

EXT_texture_compression_bptc
EXT_texture_compression_rgtc
WEBGL_compressed_texture_astc
WEBGL_compressed_texture_etc
WEBGL_compressed_texture_etc1
WEBGL_compressed_texture_pvrtc
WEBGL_compressed_texture_s3tc
WEBGL_compressed_texture_s3tc_srgb

So when using gl.texStorage2D() ETC1 is not supported and thus loaders should not select it as format.

We can do that. If KTX2Loader avoids ETC1 whenever renderer.isWebGL2 === true is that enough?

Maybe we could establish a policy that requires the usage WebGL1Renderer if users rely on ETC1?

Probably not necessary, I'm not sure what kind of device would (1) support WebGL 2, and (2) not support more compressed formats than ETC1. See platform support table. Even then, I guess a user could choose to keep using WebGL 2 and transcode the texture into uncompressed RGBA data.

[Mugen87]

If KTX2Loader avoids ETC1 whenever renderer.isWebGL2 === true is that enough?

I would say yes. Since we rely on texStorage2D() now, it's necessary to completely avoid ETC1 with WebGL 2.

[Mugen87]

I guess instead of:

three.js/examples/jsm/loaders/KTX2Loader.js

Line 89 in 098003f

etc1Supported: renderer.extensions.has( 'WEBGL_compressed_texture_etc1' ),

it would be:

etc1Supported: renderer.capabilities.isWebGL2 === false && renderer.extensions.has( 'WEBGL_compressed_texture_etc1' ), 

[donmccurdy]

Sounds good! Opened #22982.