Choppy movement in about 1 in 3 reloads.

[ansien123]

Hey guys, currently having a really odd problem. In about 1 in 3 reloads the player movement is extremely choppy in Chrome and Firefox. It feels like the player is moving at 20 fps while the game is running at a solid 60. (Doesn't seem to happen in IE for some reason)

 

My code: (ES6)

class Map {    static init(info, w, h) {        this.info = info;        this.WIDTH = w;        this.HEIGHT = h;    }    static fillArray() {        let fullArr = [];        for (let y = 0; y < this.HEIGHT; y++) {            let tempArr = [];            for (let x = 0; x < this.WIDTH; x++) {                tempArr.push(Math.round(Math.random() * 1));            }            fullArr.push(tempArr);        }        return fullArr;    }    static fillKeys() {        let fullArr = {};        for (let y = 0; y < this.HEIGHT; y++) {            for (let x = 0; x < this.WIDTH; x++) {                fullArr[x+','+y] = Math.round(Math.random() * 1);            }        }        return fullArr;    }    static createTileMap() {        this.drawInfo = game.add.tilemap();        const bmd = game.make.bitmapData(32, 32);        this.drawInfo.addTilesetImage('tiles', bmd);        this.layer = this.drawInfo.create('layer', this.WIDTH, this.HEIGHT, 32, 32);    }    static draw() {        for (let y = 0; y < this.HEIGHT; y++) {            for (let x = 0; x < this.WIDTH; x++) {                switch(this.info[x][y]) {                    case 0:                        this.drawInfo.putTile(0, x, y, this.layer);                    break;                    case 1:                        this.drawInfo.putTile(1, x, y, this.layer);                    break;                }            }        }    }}Map.HEIGHT = 32;Map.WIDTH = 32;Map.TILESIZE = 32;Map.layer;class Player {    static create() {        Player.p = game.add.sprite(100, 100, 'player');        game.physics.enable(Player.p, Phaser.Physics.ARCADE);        Player.p.body.collideWorldBounds = true;    }    static update() {		        if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT)) {            //this.p.body.x -= Math.round(this.SPEED * game.time.physicsElapsedMS);            this.p.body.x -= 3;        }        if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT)) {            this.p.body.x += 3;        }        if (game.input.keyboard.isDown(Phaser.Keyboard.UP)) {            this.p.body.y -= 3;        }        if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN)) {            this.p.body.y += 3;        }			}}Player.p;Player.SPEED = 0.18;Player.SIZE = 28;const game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render });let cursors;function preload() {    //game.load.image('player','assets/player.png');    game.time.advancedTiming = true;}function create() {    //game.stage.backgroundColor = 0x000000;    Map.info = Map.fillArray();    Map.createTileMap();    Map.draw();    Player.create();    game.physics.startSystem(Phaser.Physics.ARCADE);    cursors = game.input.keyboard.createCursorKeys();    //game.camera.deadzone = new Phaser.Rectangle(100, 100, 100, 100);    game.camera.follow(Player.p);}function update() {    Player.update();}function render() {    game.debug.text('FPS: ' + game.time.fps, 4, 14);    game.debug.text('Delta: ' + Math.round(game.time.physicsElapsedMS), 4, 28);    game.debug.text('X: ' + game.input.x + ' Y: ' + game.input.y, 5, 42);    game.debug.cameraInfo(game.camera, 5, 60);}

Tried in latest firefox and chrome 46.0.2490.71 and canary 48.0.2539.0. Anyone know why it's sometimes so choppy?

 

Edit: Transpilled fiddle: http://jsfiddle.net/oa5dmuxt/

[chg]

I'm no ES6 expert but I wouldn't think static method should be using this to access instance variables... not that this would seem to be related to the issue you describe.

[ansien123]

I'm no ES6 expert but I wouldn't think static method should be using this to access instance variables... not that this would seem to be related to the issue you describe.

 

Yeah, i quickly threw this together in one file to show it, didn't want to upload all seperate files.

 

Btw: I found that when the stuttering/choppyness happens the debug text also start flickering at the exact same times..

[ansien123]

Update:

 

Found this thread from 3 weeks ago: http://github.com.proxy.parle.co/photonstorm/phaser/issues/2121

 

Adding: game.forceSingleUpdate = true Seems to fix everything!

[WombatTurkey]

Update:

 

Found this thread from 3 weeks ago: http://github.com.proxy.parle.co/photonstorm/phaser/issues/2121

 

Adding: game.forceSingleUpdate = true Seems to fix everything!

 

 

Lol that's me  I was stuck with that bug for ages!

 

Glad you got it fixed! It's a Phaser.WebGL rendering issue (if it's even a Phaser bug, or a WebGL rendering bug, who knows).