Group sprites lag behind when camera starts moving

[hackenstein]

I noticed that my sprites lag behind the tilemap, when the camera starts to move. The tilemap scrolls along smoothly, but the position of the sprites doesn't seem to be updated right away, so they jump ~1px at the beginning of the camera movement. This happened in 1.1.2 as well as the current dev build.

 

Can be reproduced in the sci fly example by adding the following in the create function:

group = game.add.group();for (var i = 0; i < 100; i++){    group.create(game.world.randomX, game.world.randomY, 'phaser');}

(createMultiple somehow didn't create anything)

 

Is this a bug and/or is there a way to fix this?

[Crabman]

I just wanted to add real quick, in case this is a related issue, in the previous version (1.0.7a I think?) we could do a very simple transition by making the world invisible, moving the player to a new location, and making it visible again after a short timeout (it was a quick workaround as I haven't figured out how to use the worldAlpha yet.) In the current one, however, this leads to a brief glitch, where you see the same state you had before "cutting to black", before it jumps to the new location.

 

I'm a bit lost as to how you handle the drawing, but it feels like Update and Draw aren't synched properly. That's just a wild guess of course, but since it's canvas-based, it seems odd to me that, for one, the canvas is apparently first updated for the tilemap in one iteration, before updating the other sprites in the next, and of course that I get to see a previous state when turning the visibility back on after changing positions. I assume that this could in part be due to another problem we had with some things not updating while they're invisible, but even if that's the case, it still seems strange that it would draw before updating.

 

Or maybe (quite possibly) I'm just not getting how this works. But something has changed since the update, and a pointer in the right direction would be much appreciated.

[hackenstein]

I have filed an issue on git, which can be found here.

[jcs]

(pasted from git issue:)

 

I believe this is because Sprites are rendered in Sprite.postUpdate(), while TilemapLayers are rendered in TilemapLayer.update(). The call to camera.update() happens between these two calls, leading to the discrepancy.

 

I believe the fix is in World.postUpdate(), to call the postUpdate() methods before the call to camera.update(). This addresses the problem and I haven't seen any ill effects from it. I'll submit a PR and Rich can see what he thinks.

[hackenstein]

Thanks a bunch! Wasn't able to test it though. After building the current dev version with grunt I can't get the game to load my tilemaps. After loading tilemaps I get this:

TypeError: file is undefined      switch (file.type)                       phaser.js (line 32511)

When I remove the tilemaps it works. Examples with tilemaps have the same problem. It looks like a bug of the new loader, unless I screwed something up with grunt. Interestingly if I output the filetypes in the console and check if the tilemap case is actually called, it looks like everything works. The bug appears only after the last tilemap was loaded.

[hackenstein]

Rich fixed it.

Your solution is a huge improvement, thanks a lot! The sprites still jump when the camera moves the first time, but that's negligible.