Compressed file texture atlas example does not load textures (3.80.X)

[yaustar]

Version

• Phaser Version: 3.80.1

• Operating system: Mac OS

• Browser: Tested on Chrome

Description

Example shows black squares instead of the compressed texture for 3.80.X but not for 3.70.0 https://labs.phaser.io/view.html?src=src\textures\compressed%20texture%20atlas.js

[BenjaminDRichards]

Phaser 3.80 introduced new checks to ensure the validity of compressed textures. This is probably tripping those checks.

This example will use ASTC texture compression if it's supported on the current hardware. When I checked with my Android phone, it did indeed fail. This is because the ASTC texture it uses is 915x775px, but it has MIPMaps. MIPMaps under WebGL must have width and height both be powers-of-two, so it would have to be 1024x1024px to be valid.

The tools let us generate these invalid files, because they might be valid on some other systems. For example, OpenGL has some extensions which support non-power-of-two MIPMaps. But it's not valid on the Web.

There is probably a console warning in Chrome to let you know why Phaser rejected the file. Is that so?

There are two other compressed texture options in this example: PVRTC and S3TC. I can verify that S3TC works fine on Windows, which doesn't support ASTC or PVRTC. I think your Mac must be using ASTC, because the PVRTC texture appears to be well-formed. Can you confirm that? https://labs.phaser.io/view.html?src=src\textures\compressed%20texture.js should show which hardware feature the machine supports. (I tried to see for myself, but BrowserStack gave me a Mac with S3TC support.)

Compressed texture rules can be a bit obscure. The most general guideline is "everything supports power-of-two sizes". In fact, PVRTC and any format using MIPMaps require POT sizes. S3TC/S3TCSRGB, RGTC, and BPTC require sizes that are a multiple of 4. Everything else should just work. We're putting the finishing touches on an article about this, because compressed textures are so confusing and it's not always clear what you should and shouldn't do with them.

[yaustar]

Can you confirm that? https://labs.phaser.io/view.html?src=src\textures\compressed%20texture.js should show which hardware feature the machine supports. (I tried to see for myself, but BrowserStack gave me a Mac with S3TC support.)

On my Mac, it's loading as

[BenjaminDRichards]

As I suspected. The Mac supports ASTC, so it's getting a file with problems we didn't know were problems until we went hard into WebGL's compressed texture treatment. I'll have to set aside time to recompress everything in the Examples.