[SOLVED] Frame rate jitter in point and click sample

Help & Support
1

Hey, we’re using code based on the point and click example:

https://playcanvas.com/editor/project/461494

but when frame rate judders - just due to scene complexity, the derived position is jumping back and forth. Has anyone else faced this? Is there a better ‘move to’ method?

I’m guessing the variance in dt is breaking it?

Thanks, Bruce

AvatarMove.prototype.update = function (dt) {
    
    if (this.direction.lengthSq () > 0) {
        // Move in the direction at a set speed
        var d = this.playerWalkSpeed * dt;
        
        var newPosition = this.currentPosition;
       
        newPosition.copy (this.direction).scale(d);
        newPosition.add (this.entity.getPosition());        
        this.entity.setPosition (newPosition);
        
        this.distanceToTravel -= d;
2

Hi @brucewheaton,

Hmm, I can’t reproduce this on the given sample, it’s a super simple scene frame rate is quite stable.

The dt factor is added to the method you quote exactly for that purpose, to smooth out the movement when the frame rates varies.

Did you try using the provided code in a more complex project?

3

Hmm, @Leonidas I think he varies the speed based on the delta time passed from the previous frame render. That delta can flactuate, and this is probably why he experiences some changes in speed?

@brucewheaton perhaps remove the dt from the walk speed equation?

Edit: Also I noticed you reduce the travelled distance by speed amount? Not sure what that means.

4

Yes, my project is more complex. I did more debugging and found that the numbers show differing move amounts, but not the sort of judder I’m getting visually, so - thinking a bit more, I’m seeing that is actually my chase camera, which is alternately falling behind them jumping ahead - the combined elastic band effect is making the judder I’m seeing.

So - false alarm on point and click sample, sorry. I need to work on other ways to chase my target or smooth the camera out.

In case this is at all interesting - I’m using the orbit camera, clumsily modified to just refocus on the target every update. I guess I need a more sophisticated follow function.

1 Like
5

Actually multiplying by dt is the only way to ensure smooth movement. The update method is firing per frame but each frame render time varies.

So if you aren’t multiplying by dt and you are translating your model by a constant value, you will see it move at a different step from time to time, depending on your frame rate (unless you are moving at a custom fixed timestep of your own).

The velocity is constant only when you move the same amount of units at the same timespan.

1 Like
6

Also try moving logic for the camera to postUpdate so that all the update calls happen first

2 Likes
7

Thanks Alexander - I love being back on PC after fighting with another system for a while, what a knowledgeable and helpful community!

It was basically user error - the dt stuff is correct and does the best it can to make motion as smooth as possible with dropped frames. In know in games, the trick is to drop frame rate until it can be achieved consistently (and maybe occasionally try to step back up) which would smooth it a bit more too.

But as I mentioned, the actual problem was my orbit camera chasing badly, using a slightly different method to handle discontinuous dt’s.

Thanks

1 Like
8

Ah, you are right. I see it is used to set the new position. I need a rest…

1 Like
9

Holy cow Steven! Gotta love a one word fix! I moved my camera moves to postupdate and it’s totally acceptable for now!

Thank you!

1 Like