2
\$\begingroup\$

What My Code Does

I made this simple arcade game where you use the mouse/pointer to move the character around, by now it's all it does, it uses phaser.io

platform

My Concerns

I'm new to Phaser (and a crappy programmer), and I would like to know what optimizations I could do on my code to have a better performance on it, it runs on mobile and it is fairly quick on low end devices, but I`m afraid that as I add more sprites and functions it will get quite heavy so in order to minimize that I would like to know what I'm already doing that might hurt performance in the future

My Code:

var game = new Phaser.Game(1066.66,600, Phaser.Canvas,"gameDiv");
//var game = new Phaser.Game(window.innerWidth * window.devicePixelRatio, window.innerHeight * window.devicePixelRatio, Phaser.Canvas,"gameDiv");

console.log(window.innerWidth * window.devicePixelRatio);

var mainState = {

    init: function () {

		game.renderer.renderSession.roundPixels = true;

		game.physics.startSystem(Phaser.Physics.ARCADE);

		game.physics.arcade.gravity.y = 800;

		game.physics.arcade.gravity.x = -10850;

		refresh();

    },
	preload: function(){

        //Loads background imagery
		game.load.image(`background`, "assets/background_1877_600.png");
		game.load.image(`skyscrapers`, "assets/skyscrapers_800_180.png");
		game.load.image('ground', "assets/ground_53_53.png");

        //Loads player`s moves/powers
		game.load.spritesheet('mainCharacter', 'assets/boo_100.png', 100, 100);
		game.load.spritesheet('eva01', 'assets/EVA01_192.png', 192,192);
		game.load.spritesheet('rasengan', 'assets/rase_96.png', 96,96);
        
        //Game`s Music
        game.load.audio('boden', ['assets/audio/bodenstaendig_2000_in_rock_4bit.mp3']);
        
        //Loads player's buttons



	},
	create: function(){
        
        window.onresize = function(event) {
            refresh();
        };
            
        //Music
        /*music = game.add.audio('boden');
        music.loop(true);
        music.play();*/

		background = game.add.tileSprite(0,0,1877,600,`background`);

        
		skyscrapers = game.add.tileSprite(0,375,1066.66,180, 'skyscrapers');

        
		ground = game.add.tileSprite(0,550,1066.66,90, 'ground');

		
		//Set up player
		player = game.add.sprite(100,100,`mainCharacter`);
		player.anchor.setTo(0.5);
		player.facing = 'still';
		player.jumpTimer = 0;        
		
        //Set up player buttons


		//Enables physics and boundaries on player
		game.physics.arcade.enable(player);
		player.body.collideWorldBounds = true;
        player.body.setSize(100, 100, 0, 35);
        

        //Enables moves on player
        player.animations.add('stillRight', [8,9], 3, true);
        player.animations.add('stillLeft', [0,1], 3, true);
        player.animations.add('runRight', [5,6,7], 15, true);
        player.animations.add('runLeft', [2,3,4], 15, true);
        
        //Sets button frames

        //Sets buttons actions
        


		//Set up cursors
		game.cursors = game.input.keyboard.createCursorKeys();
        refresh();


	},
	update: function(){
		background.tilePosition.x -= 0.25;
		skyscrapers.tilePosition.x -= 0.5;
		ground.tilePosition.x -= 3;
		
		//Right and left movements and sprites	

      	dollMoves(player, game);
      	//enemyMoves(enemy, game);

	}
}

game.state.add(`mainState`,mainState);
game.state.start(`mainState`);


//Resizes screen
function refresh(){
    resizeScreen();
}

function resizeScreen(){
    console.log(window.innerWidth * window.devicePixelRatio);
    game.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL;
    game.scale.pageAlignHorizontally = true;
    game.scale.pageAlignVertically = true;
    game.scale.setShowAll();
    game.scale.refresh();
}

function dollMoves(player, game){
    
	    player.standing = player.body.blocked.down || player.body.touching.down;

		player.body.velocity.x = 0;

        if (game.input.activePointer.isDown)
    {
        //  400 is the speed it will move towards the mouse
        if(game.input.x <= player.x){
            player.body.velocity.x = -400;

            if (player.facing !== 'left')
            {
                player.play('runLeft');
                player.facing = 'left';
            }
        }else{
            player.body.velocity.x = +700;

            if (player.facing !== 'right')
            {
                player.play('runRight');
                player.facing = 'right';
            }
        }

        //  if it's overlapping the mouse, don't move any more
        if (Phaser.Rectangle.contains(player.body, game.input.x, game.input.y))
        {
            player.body.velocity.setTo(0, 0);
        }
        
        }else{
                if (player.facing !== 'idle')
                {
                    if (player.facing === 'left')
                    {
                        player.play('stillLeft');
                    }
                    else
                    {
                        player.play('stillRight');
                    }

                    player.facing = 'idle';
                }

                if(player.body.blocked.left || player.body.touching.left && player.facing == 'idle'){

                	player.play('runRight');
                	player.facing = 'idle';

                }
            }
    
        //Jump up and down
        if (player.standing && (game.input.activePointer.isDown && game.input.y < 300) && game.time.time > player.jumpTimer)
        {
        	player.body.velocity.y = -700;
            player.jumpTimer = game.time.time + 70;

        }
        if(game.input.activePointer.isDown && game.input.y > 500){
        	player.body.velocity.y = +1200;
        }
};


function enemyMoves(entity, game){

};

\$\endgroup\$
  • 1
    \$\begingroup\$ @t3chb0t Thanks for the heads up, I edited it \$\endgroup\$ – Kyle Mar 30 '18 at 16:33
  • \$\begingroup\$ Great! And there's even a picture ;-D \$\endgroup\$ – t3chb0t Mar 30 '18 at 16:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.