DynamicTexture drawImage update


I’m using DynamicTexture to render a stream of jpeg images with web worker to first handle the incoming data (reassemble the packets since frame size is quite big). I’ve noticed that when displaying in the same time 4 motion jpeg players the FPS is dropping for all players. Is there a better way of doing so other than :
img.src = buffer_string;
img.onload = () => {
textureContext.drawImage(img, 0, 0);

where textureContext = this.planeTexture.getContext();
and planeTexture is a DynamicTexture object.

I think that updating the texture is a consuming and heavy operation, am I right?


Well it is time consuming but how big is the fps drop? Can you run a profile?

I ran a profile and the time it took to update the texture ranges between 3 ms and 13 ms.
It takes the web worker to handle the packets about 1.5 ms (most of the time it’s less the 1 ms).
The fps drop is quite fuzzy it ranges from 28 to 45 fps.

Is there a better way of doing it?

13ms is clearly too much. As a reference the GUI which used the same tech updates in less than a millisecond

How large are your files?

We use 1MB, 2MB and 4MB cameras, but the backend resize them all to 640x480.

well then this is definitely too slow
Can you repro somehow in the PG?

I can’t repro the stream, sorry…
other than that the code is quite simple and it’s in the original post

Well so do you repro your issue in the PG? I mean the perf issue?


sorry it took too long

In your example you are reloading the img on every tick so this may not be accurate. You should keep the img because else the decoding process can be long