Thin Instance Hover Performance

Questions
1

Hello friends,

I am trying to improve the performance (FPS) of thin instances with mouse hover interaction. Here is a “hover bomb” I’ve created using two pre-existing playgrounds: https://playground.babylonjs.com/#V1JE4Z#75

I’m probably just not taking advantage of something in the API. Any pointers would be appreciated!

Thanks.

2

Hello,

You can use scene.onPointerMove for example so the picking is only computed when the mouse move, better than before each render ! See : https://playground.babylonjs.com/#V1JE4Z#77

2 Likes
3

Thanks!

I’d just done something similar with scene.onPointerObservableAdd (using BABYLON.PointerEventTypes.POINTERMOVE).

Although using either that or scene.onPointerMove increases FPS while the mouse is not moving, the FPS still drops significantly (60 → 14) when the mouse is moving about.

Any thoughts on improving perf there?

4

You can pick only when the mouse button is not down for example : https://playground.babylonjs.com/#V1JE4Z#79

Your FPS would still be low when mouse is not down but no one will notice it since there’s no interaction (a camera move for example).

You also probably could gain some more FPS on mouse move by throttling the event

1 Like
5

Not checking when mouse is down is feasible - thanks!

You also probably could gain some more FPS on mouse move by throttling the event

Maybe like so?: https://playground.babylonjs.com/#V1JE4Z#80

This seems to improve things. I’ve throttled to 100ms (60 FPS is ~ 17ms). Not sure if that’ll feel responsive enough if, say, I attempt to change the color of the hovered instance.

1 Like
6

You can try to use GPU pick.

4 Likes
7

@tanpopo woooowww that’s great very well done !! I already had this idea but never took the time to make it :stuck_out_tongue: !!

1 Like
8

Thanks, @tanopo! This is great!

1 Like