question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Remove sRGB inline decoding.

See original GitHub issue

I’m currently working on a PR to remove the inline sRGB decode from the shader. We want to do this to avoid wrong texture filtering which was discussed in earlier issues. The removal also simplifies the code base at various places (especially the WebGL 2 code paths).

The idea is to use SRGB8_ALPHA8 with WebGL 2 and a fallback for WebGL 1. In order to use SRGB8_ALPHA8, textures have to be in RGBA format and must use unsigned byte which is true for most color textures. However, there are a couple of issues with that approach and I want to discuss them step by step. The first problem is processing compressed textures holding sRGB encoded values like in:

https://github.com/mrdoob/three.js/blob/d10d1be864f5e08c9d13dc098dd07af61c39de53/examples/webgl_loader_texture_basis.html#L53-L58

How should we handle this use case? Decoding compressed texels values on the CPU is by definition no option. If you do a separate render pass and decode the texture into a render target, we would loose the compression (unless we compress it again which is no good idea either).

As far as I understand we can only support compressed textures with sRGB values if formats like SRGB8_ALPHA8_ASTC_4x4_Format are used. Or we have to keep the inline decode. Are there any other options?

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:16 (5 by maintainers)

github_iconTop GitHub Comments

2reactions
Mugen87commented, Jan 4, 2022

I’ve added a solution here: https://github.com/mrdoob/three.js/pull/23129/commits/57ac4776ac7328f7fd239c5b24b61a96171e8419

Should be easy to revert when the Chromium bug is solved.

Just for the protocol: VideoTexture does not use gl.texStorage2D() right now and with the above commit no SRGB8_ALPHA8 format. The sRGB decode happens inline and only if the texture is assigned to the map property.

1reaction
Mugen87commented, Dec 30, 2021

Can WebGL not do sRGB conversion for compressed formats other than ASTC? 😕

Yes, it can. However, three.js does not support them yet. After looking at the extensions the following sRGB formats could be added:

  • WEBGL_compressed_texture_etc
    • COMPRESSED_SRGB8_ETC2
    • COMPRESSED_SRGB8_PUNCHTHROUGH_ALPHA1_ETC2.
    • COMPRESSED_SRGB8_ALPHA8_ETC2_EAC
  • WEBGL_compressed_texture_s3tc_srgb
    • COMPRESSED_SRGB_S3TC_DXT1_EXT
    • COMPRESSED_SRGB_ALPHA_S3TC_DXT1_EXT
    • COMPRESSED_SRGB_ALPHA_S3TC_DXT3_EXT
    • COMPRESSED_SRGB_ALPHA_S3TC_DXT5_EXT
  • EXT_texture_compression_bptc
    • COMPRESSED_SRGB_ALPHA_BPTC_UNORM_EXT
Read more comments on GitHub >

github_iconTop Results From Across the Web

Transparent objects brighten when using ... - GitHub
js converts to sRGB color space in-line in the shader, prior to blending with the drawing buffer. This is fine if the material...
Read more >
Is there a three 137 migration guide? - Questions - three.js forum
The general rule of thumb is all sRGB encoded textures have to be defined in RGBA8. In three.js that is the combination of...
Read more >
Annotated List of Command-line Options - ImageMagick
Remove : Composite the image over the background color. ... Here we take an sRGB image and a grayscale image and inject the...
Read more >
How to setup proper color management in your web browser
In summary, I take an image, assign a profile if none exists and then export with sRGB ICC embedded. Affinity is in line...
Read more >
Maximally optimizing image loading for the web
This has all kinds of benefits, but the most important one might be that the browser will not bother decoding our blurry placeholder...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found