Stuck for a while when loading a cubemap

Is there any way to minimize the lag when loading a new cubemap?

I think that creating a minimal reproducible sample is the easiest way to illustrate it:
https://playcode.io/threejscubemap

If you press ‘space’ there you’ll notice that the animation will be stopped for a while.

Is there any chance to calculate the loading on a background thread and continue the animation meanwhile or something like that?

Thank ou in advance!

Can you please verify if this fiddle performs better? It’s the same code as you live example except that is uses a custom cube texture loader based on ImageBitmapLoader. three.js dev template - module - JSFiddle - Code Playground

1 Like

It works much better!

To clarify the issue: The root cause is the decoding overhead when the texture is uploaded to the GPU. This does not happen with the ImageBitmap API because the decode happens asynchronously. Another way to solve the issue is to work with compressed textures.

Unfortunately, we can’t use ImageBitmapLoader in CubeTextureLoader or TextureLoader by default yet.

1 Like