Image class has poor performance when transparent parts of image should be ignored (detectPointerOnOpaqueOnly)

This problem is in Babylon 4.1.0.

Let’s take any example with detectPointerOnOpaqueOnly: https://www.babylonjs-playground.com/#XCPP9Y#1510

The problem is in the Image.contains method. It calls every time when a mouse moves, and every time this method creates a copy of the image data:

This causes low fps when a mouse hovers over such images (GC/etc). I would suggest using a cache, something like the following code:

Seems good to me, let see what @Deltakosh thinks about this.

I think it may be a little more complicated, however, as the cache may have to be invalidated when the picture is updated / the width/height are not the same than when the cache was created.

Maybe you are right, it should be more sophisticated. I don’t change pictures at runtime, so it works for me.
Without that I get 20 FPS on Oculus Go :frowning:

I agree let’s improve that!

Issue created:

PR on its way:

1 Like

Merged!

1 Like