Tweens lag and fail to catch up (regression from 2.1)

[nkovacs]

Phaser 2.3.0: http://jsfiddle.net/nkovacs/8x23e7e1/

Phaser 2.1.3: http://jsfiddle.net/nkovacs/b0g1b7nL/

It'll console.log the difference between the expected position of the sprite and the actual position.

Normally it'll be close to 0 on both. But if you start to resize the result window, the Phaser 2.3 tween will lag behind, while the 2.1.3 one doesn't.
If you put the tab in the background, the Phaser 2.1.3 tween will catch up once you bring it back in the foreground. The Phaser 2.3 tween never catches up.

This is a problem for me, because I'm working on a multiplayer game, where the server has its own timers, and expects the animations to match up. E.g. the server knows that an enemy will reach its destination in X seconds, and damage the player. Because of this lag, the player is damaged before they see the enemy reaching them.

Unlike the jsfiddle example, my game's running at only 15-20 fps for some reason, which makes the problem even worse, as the tween is continuously accumulating lag.

[hilts-vaughan]

As a quick fix, try forcing a single update per frame. I reckon that's part
of the cause.
On May 27, 2015 5:27 AM, "nkovacs" notifications@github.com wrote:

Phaser 2.3.0: http://jsfiddle.net/nkovacs/8x23e7e1/

Phaser 2.1.3: http://jsfiddle.net/nkovacs/b0g1b7nL/

It'll console.log the difference between the expected position of the
sprite and the actual position.

Normally it'll be close to 0 on both. But if you start to resize the
result window, the Phaser 2.3 tween will lag behind, while the 2.1.3 one
doesn't.
If you put the tab in the background, the Phaser 2.1.3 tween will catch up
once you bring it back in the foreground. The Phaser 2.3 tween never
catches up.

This is a problem for me, because I'm working on a multiplayer game, where
the server has its own timers, and expects the animations to match up. E.g.
the server knows that an enemy will reach its destination in X seconds, and
damage the player. Because of this lag, the player is damaged before they
see the enemy reaching them.

Unlike the jsfiddle example, my game's running at only 15-20 fps for some
reason, which makes the problem even worse, as the tween is continuously
accumulating lag.

—
Reply to this email directly or view it on GitHub
#1819.

[hilts-vaughan]

http://phaser.io/docs/Phaser.Game.html/Phaser.Game.html#forceSingleUpdate
On May 27, 2015 5:27 AM, "nkovacs" notifications@github.com wrote:

Phaser 2.3.0: http://jsfiddle.net/nkovacs/8x23e7e1/

Phaser 2.1.3: http://jsfiddle.net/nkovacs/b0g1b7nL/

It'll console.log the difference between the expected position of the
sprite and the actual position.

Normally it'll be close to 0 on both. But if you start to resize the
result window, the Phaser 2.3 tween will lag behind, while the 2.1.3 one
doesn't.
If you put the tab in the background, the Phaser 2.1.3 tween will catch up
once you bring it back in the foreground. The Phaser 2.3 tween never
catches up.

This is a problem for me, because I'm working on a multiplayer game, where
the server has its own timers, and expects the animations to match up. E.g.
the server knows that an enemy will reach its destination in X seconds, and
damage the player. Because of this lag, the player is damaged before they
see the enemy reaching them.

Unlike the jsfiddle example, my game's running at only 15-20 fps for some
reason, which makes the problem even worse, as the tween is continuously
accumulating lag.

—
Reply to this email directly or view it on GitHub
#1819.

[nkovacs]

That makes it even worse: http://jsfiddle.net/nkovacs/8x23e7e1/11/

[clark-stevenson]

I am also trying to profile something similar. I am not convinced it is related only to tweens. I have 6 Phaser.Image instances which I loop over on the update loop shifting their y += 5. This lags in a similar way but the annoying thing is that I cannot narrow it down. I cut my asset resolution in half (got rid of native retina) and yeah its faster, but the grind is still there the same so I ruled that out really.

forceSingleUpdate kind of does a little better but the gained smoothness still is invalidated by the grind so this setting is preferable but the issue remains. I have also not noticed a major difference between canvas and webgl on my ipad. Even so, neither solves the problem.

The reason I am using my Ipad, is because It happens on my desktop as well across all browsers. From @englercj https://github.com/englercj/phaser-debug great plugin, to the canary dev tools, to simply logging out the FPS. Nothing is giving me any clues and nor is it tied to any specific other event that I can see. I just mean it is not related to any specific functionality but rather everything which is bringing me back to timer and/or game/render loop.

It kills me that I cannot provide useful details!

[photonstorm]

This is now fixed in the dev branch (the Tween issue anyway). In theory it shouldn't have mattered if the browser lagged, as Game will run multiple logic updates to catch-up with itself. But there is a cap on the quantity it can do, and sometimes it just isn't enough - so Tweens will now use their own internal delta timer value to ensure that they complete within the duration specified, no matter what happens to the browser. It means they're at the mercy of browser stutters visually though, but that's probably a safe price to pay.