With KTX2 textures one can store normal maps in GGGR format. This helps with the compression issues with KTX2 textures which are noticeable with normal maps. G is stored in the RGB channels and R in the alpha channel. PlayCanvas supports it. I was just wondering if Three.js does also.
Yes, with these changes:
- Renderers: Add support for EAC texture formats. by castano · Pull Request #32308 · mrdoob/three.js · GitHub
- KTX2Loader: Add support for BC4, BC5 by donmccurdy · Pull Request #31713 · mrdoob/three.js · GitHub
- NormalMapNode: Add basic support for normal unpacking. by castano · Pull Request #31695 · mrdoob/three.js · GitHub
I’m not sure what workflows to recommend for creating these RG normal maps today, though. If you’re using KTX2 with Basis Universal (ETC1S, UASTC, XUASTC…) there is not currently an API exposed to cause THREE.KTX2Loader to transcode into RG-only formats, so you’d need to do some investigation there in terms of compressing and transcoding. I don’t really know if Basis Universal is optimized for that use case or not, in terms of quality and file size.
Or you could compress directly into one of these formats in a KTX2 container, but you’d then need to check that your device supports the format and load a fallback texture if not, since these formats are not universal.
Finally, if you can depend on WebGPU for your project, I would consider spark.js .