Mesh movement not smooth

Hi,

I am trying to make a simple plane mesh to move around the the set with the arrow keys, but I can’t get the movement as smooth as the alien asset (or expected)

https://www.babylonjs-playground.com/#9DJ8HK

I have tried to use the animation object, and also to make translations of the object but none of them gives me a smooth transition/movement. It always looks like the alien has more computed fps than the moving mesh.

Maybe I don’t know how to use the “logic loop”? Can you help me?

1 Like

Welcome to the forum!

I don’t really understand your question, because for me the moving of the plane is very smooth…

Maybe I am too demanding with the animation, but for me it looks like it vibrates, or like it is not as smooth as butter. Also despite I get around 60fps with engine.getFps(), and this is how the ‘alien’ animation looks, the gameLogic (registerBeforeRender) call doesn’t look like is 60fps. Can there be a difference between the engine.getFPS and the registerBeforeRender real number of calls per second? That would explain my problem.

You need to add inertia to make it smooth:
https://www.babylonjs-playground.com/#9DJ8HK#1

(I only applied the inertia on up and down arrow)

1 Like

Well, maybe ‘smooth as butter’ was not the best expression, sorry for my English, I applied inertia to vertical and horizontal directions:

https://www.babylonjs-playground.com/#M20E4L

And yes, it is slippery now. But I still see the ‘blurry’ effect (or the missing frames) when the mesh moves. :man_shrugging:

Thanks for your help

Its looking like that is caused by frame drops? I turned the speed delta to 120/1000 and it seems to smoothed things out.

Sounds like it might be localized to your client, what kinda of setup you running?

Yes, it may be my computer (elementary OS, chrome, hw accelerated, quad-core i5 1.6GHz, Nvidia GeForce, 8GB RAM). But I don’t understand why the ‘alien’ animation is very smooth and the ‘registerBeforeRender’ isn’t.

Also, I don’t understand the next results of engine.getFps() and the engine.getDeltaTime() on my computer, because the next captured consecutively results:

A: deltaTime: 10.724999998274143 FPS 48.289349783903674
B: deltaTime: 15.655000001061126 FPS 48.526807016943444
C: deltaTime: 10.935000000245054 FPS 49.04004119362215

Doesn’t make sense for me, how the delta time of B is bigger than A and C but FPS of C are bigger than B?

deltatime is one thing but there is also time spent in the driver and inside the browser

But anyhow I do not see the issue even on my old surface 2 which is running at 25fps :slight_smile:

Thanks, it may be my screen that is not ready for “fast” animations.

Haha yeah or there is something we are missing
Does it repro on all major browsers?

1 Like