Prepare.upload does not actually upload the texture

[mariogarranz]

I have a very big texture for a Spine animation that causes a ~400ms delay whenever it's rendered for the first time. I have been trying to avoid this by trying to use prepare.upload in multiple different ways, but this just does not seem to make any difference.

prepare.upload resolves within a few ms (~10ms measured using performance), then when adding the animation the big freeze happens again, and if I profile the performance I can see all that delay is spent uploading the texture to the GPU.

This is the current test code I'm using:

const sprite = PIXI.Sprite.from("/assets/bigwin/muscle_logo.webp");
const t0 = performance.now();
app.renderer.prepare.upload(sprite).then(() => console.log(performance.now() - t0));

Any idea on what could be going wrong? As far as I understand this is exactly how it should work.

Edited July 13, 2023 by mariogarranz

[stevediaz]

Hi @mariogarranz,

 

I was also facing the smae issue  To optimize the loading process, consider these steps:

 

1.Texture Compression: Try compressing the texture to reduce its size and improve loading speed.

 

2.Mipmapping: Enable mipmapping for better rendering performance.

 

3.Texture Atlas: Use a texture atlas to combine multiple textures into one, reducing draw calls.

 

4.Progressive Loading: Load essential textures first, then asynchronously load the big texture after initial rendering.

 

Hope it helps you.

CCSP Course