Jump to content

Phaser Game Lag In Mobile


Shashank Padwal
 Share

Recommended Posts

Hi,

I am new to phaser as well as game designing.
I created my first game as hobby using phaser.
it is working fine in desktop but lags very bad on mobile devices.
Images I am using for game is very small.
game is smaller that 2mb.
I am attaching my main.js file 

hope someone can help me.

thanks 

var buttetSpwanSpeed;
var bulletSpeed;
var enemySpwanSpeed;
var enemySpeed;
var golis;
var enemies;
var enemyLoop;
var scoreText;
var powers;
var bulletSize;
setStart();
//game phaser
var game=new Phaser.Game(window.innerWidth, window.innerHeight, Phaser.CANVAS,"gamearea");
var BootState={
	//loding accets
	preload: function(){
		this.load.image('LodingScreen', 'assets/desimulga.png');
		this.load.image('background', 'assets/blue.png');
	},
	create: function(){
		game.state.start("LoadingState");
	},
	
};

var LoadingState={
	//loding acc
	preload: function(){
		bg=this.game.add.tileSprite(0,0,600,300,'background');
		bg.height = game.height;
    	bg.width = game.width;
		LodingScreen=this.game.add.sprite(this.game.world.centerX,this.game.world.centerY,'LodingScreen');
		LodingScreen.anchor.setTo(0.5);
		LodingScreen.scale.setTo(0.5,0.5);
		this.load.image('spaceship', 'assets/player.png');
		this.load.image('goli', 'assets/bullet.png');
		//load ememies
		this.load.image('enemy1', 'assets/enemies/enemy1.png');
		this.load.image('enemy2', 'assets/enemies/enemy2.png');
		this.load.image('enemy3', 'assets/enemies/enemy3.png');
		this.load.image('enemy4', 'assets/enemies/enemy4.png');
		this.load.image('enemy5', 'assets/enemies/enemy5.png');
		this.load.spritesheet('power1', 'assets/power/bulletUp.png',34,33,4);

		this.load.image('restart', 'assets/restart.png');
		this.load.spritesheet('blast', 'assets/explosion.png',400,400,8);
		game.load.audio('fire', 'assets/music/bullet.mp3');
		game.load.audio('killed', 'assets/music/killed.mp3');
		//game.load.audio('bg_music', 'assets/music/background.mp3');
		game.load.audio('death_music', 'assets/music/death.mp3');
		game.load.audio('start_music', 'assets/music/start.mp3');
	},
	create: function(){
		game.time.events.add(Phaser.Timer.SECOND * 2, function(){
			bg.kill();
			LodingScreen.kill();
			game.state.start("PreGameState");
	},this);
	},
	
};

var PreGameState={
	//loding accets
	create: function(){
		game.scale.refresh();
		bg=this.game.add.tileSprite(0,0,600,300,'background');
		bg.height = game.height;
    	bg.width = game.width;
		Startb=this.game.add.text(this.game.world.centerX,this.game.world.centerY, 'TAP TO START' , { fontSize: '32px', fill: 'yellow' });
		Startb.anchor.setTo(0.5);
		Startb.scale.setTo(0.5,0.5);
		ship=this.game.add.sprite(this.game.world.centerX,this.game.world.height*0.4,'spaceship');
		ship.scale.setTo(0.4);
		ship.anchor.setTo(0.5);
		game.physics.arcade.enable(ship);
		bg.inputEnabled=true;

		start_music = game.add.audio('start_music');
    	start_music.allowMultiple = true;
    	start_music.addMarker('start_music', 0, 30);
		

		bg.events.onInputDown.add(function(){
			bg.inputEnabled=false;
			Startb.kill();
			start_music.play("start_music");
			// game.physics.arcade.moveToXY(ship, this.game.world.centerX, this.game.world.height*0.8, 300, 3000);
			// game.add.tween(ship).to( { y: game.world.height*0.8 }, 3000, Phaser.Easing.Sinusoidal.InOut, true);
			var tween = game.add.tween(ship).to({
			x: [this.game.world.centerX, this.game.world.width*0, this.game.world.width, this.game.world.centerX],
			y: [this.game.world.height*0.4, this.game.world.height*0.5, this.game.world.height*0.6, this.game.world.height*0.8],
			}, 2000,Phaser.Easing.Quadratic.Out, true).interpolation(function(v, k){
			    return Phaser.Math.bezierInterpolation(v, k);
			});

			game.time.events.add(Phaser.Timer.SECOND * 2, function() { 
				bg.kill();
				ship.kill();
				game.state.start("GameState");
			} ,this);
			
		}, this);
	},
	
};





var GameState={
	//loding accets
	preload: function(){
		

	},
	create: function(){
		//background
		this.background=this.game.add.tileSprite(0,0,600,300,'background');
		this.background.height = game.height;
    	this.background.width = game.width;
		this.background.inputEnabled=true;
		this.background.input.enableDrag(true);
		this.background.input.startDrag = function(pointer) {
		    pointer.shipStart = new Phaser.Point(GameState.ship.x, GameState.ship.y);
		    Phaser.InputHandler.prototype.startDrag.call(this, pointer);
		};
		this.background.input.updateDrag = function(pointer) {
		    GameState.ship.x = pointer.shipStart.x - pointer.positionDown.x + pointer.x;
		    GameState.ship.y = pointer.shipStart.y - pointer.positionDown.y + pointer.y;
		    GameState.background.x=0;
		    GameState.background.y=0;
		};
		//ship
		this.ship=this.game.add.sprite(this.game.world.centerX,this.game.world.height*0.8,'spaceship');
		this.ship.scale.setTo(0.4);
		this.ship.anchor.setTo(0.5);
		game.physics.arcade.enable(this.ship);
		// this.ship.inputEnabled=true;
		// this.ship.input.enableDrag(true);
		//score
		this.scoreText = this.game.add.text(16, 16, 'Kills: 0', { fontSize: '32px', fill: '#fff' });
		//background Music
		// music = game.add.audio('bg_music');
    	//music.play('', 0, 1, true);
		//bullet sound
		bullet_sound = game.add.audio('fire');
    	bullet_sound.allowMultiple = true;
		bullet_sound.volume=0.5;
    	bullet_sound.addMarker('fire', 0, 0.5);
    	//Killed sound
		killed_sound = game.add.audio('killed');
    	killed_sound.allowMultiple = true;
    	killed_sound.addMarker('killed', 0, 0.5);
    	//death music
    	death_music = game.add.audio('death_music');
    	death_music.allowMultiple = true;
    	death_music.addMarker('death_music', 0, 10);
    	//groups of bullets and enemies
    	golis=game.add.group();
    	enemies=game.add.group();
    	powers=game.add.group();
		//fire bullet loop
		fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/buttetSpwanSpeed, fireBullet, this);
		//this.game.input.onTap.add(fireBullet, this);
		//create ememy loop
		enemyLoop=game.time.events.loop(Phaser.Timer.SECOND*1/enemySpwanSpeed, createEnemy, this);
		//change ememy speed and enemy spwan speed loop
		enemySpeedLoop=game.time.events.loop(Phaser.Timer.SECOND*1.5, changeEnemySpeed, this);
		//give powerup
		powerUp=game.time.events.loop(Phaser.Timer.SECOND*20, powerFun, this);		
	},
	update: function(){
		//scrolling background
		this.background.tilePosition.y+=2;

		//keybord control
		if (game.input.keyboard.isDown(Phaser.Keyboard.UP))
		{
			this.ship.y-=2;
		}
		if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))
		{
			this.ship.y+=2;
		}
		if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))
		{
			this.ship.x+=2;
		}
		if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))
		{
			this.ship.x-=2;
		}

		//dont go out
		if(this.ship.y<0+this.ship.height/2)
		{
			this.ship.y=0+this.ship.height/2;
		}
		if(this.ship.y>this.game.world.height-this.ship.height/2)
		{
			this.ship.y=this.game.world.height-this.ship.height/2;
		}

		if(this.ship.x<0+this.ship.width/2)
		{
			this.ship.x=0+this.ship.width/2;
		}
		if(this.ship.x>this.game.world.width-this.ship.width/2)
		{
			this.ship.x=this.game.world.width-this.ship.width/2;
		}
		//check for collisions 
		game.physics.arcade.overlap(golis,enemies,b_e_collide,null,this);
		game.physics.arcade.overlap(this.ship,enemies,s_e_collide,null,this);
		game.physics.arcade.overlap(this.ship,powers,s_power1_collide,null,this);



		
	},
};


//setting start game conditions
function setStart(){
	buttetSpwanSpeed=2;
	bulletSpeed=2000;
	enemySpwanSpeed=1;
	enemySpeed=300;
	score=0;
	bulletSize=1.2
}

//fire bullet function
function fireBullet(){
	goli=this.game.add.sprite(this.ship.x,this.ship.y-this.ship.height/2,'goli');
	goli.anchor.setTo(0.5);
	goli.scale.setTo(bulletSize,1);
	goli.checkWorldBounds = true;
	goli.outOfBoundsKill = true;
	//adding to group
	golis.add(goli);
	game.world.moveDown(goli);
	game.physics.arcade.enable(goli);
	goli.body.collisonWorldBounds=true;
	goli.body.velocity.y=-bulletSpeed;
	bullet_sound.play("fire");
}
//create enemy function
function createEnemy(){
	enemyNo=game.rnd.integerInRange(1, 5);
	x1=game.rnd.integerInRange(0,this.game.world.width);
	x2=game.rnd.integerInRange(0,this.game.world.width);
	enemy=this.game.add.sprite(x1,10,'enemy'+enemyNo);
	enemy.anchor.setTo(0.5);
	enemy.scale.setTo(0.4);
	enemy.checkWorldBounds = true;
	enemies.add(enemy);
	enemy.outOfBoundsKill = true;
	game.physics.arcade.enable(enemy);
	enemy.body.collisonWorldBounds=true;
	enemy.angle=90;
	enemy.no=enemyNo;

	//moving enemy
	angleRedian=game.physics.arcade.moveToXY(enemy, x2, this.game.world.height+enemy.height, enemySpeed,0);
	angleDegree=angleRedian*57.2958;
	enemy.angle=90+angleDegree;

}

//runs when bullet collide to enemy
function b_e_collide(goli,enemy){
	//blast
	blast=this.game.add.sprite(enemy.x,enemy.y,'blast');
	blast.anchor.setTo(0.5);
	blast.scale.setTo(0.5);
	var explosion=blast.animations.add('explosion');
	blast.animations.play('explosion',30,false,true);

	//killing
	goli.kill();
	enemy.kill();

	//update scores
	if(enemy.no<4)
	{
		score+=1;
		killed_sound.play('killed');
	}
	this.scoreText.text = 'Kills: ' + score;
}
//runs when ship collide to enemy
function s_e_collide(ship,enemy){

	blast=this.game.add.sprite(enemy.x,enemy.y,'blast');
	blast.anchor.setTo(0.5);
	blast.scale.setTo(0.5);
	var explosion=blast.animations.add('explosion');
	blast.animations.play('explosion',10,false,true);
	ship.kill();
	enemy.kill();
	//music.stop();
	this.scoreText.kill();
	death_music.play("death_music");
	game.time.events.remove(fireLoop);
	game.time.events.add(Phaser.Timer.SECOND * 2, function() {    
		fianlScore = this.game.add.text(this.game.world.centerX,this.game.world.centerY, 'KILL: '+score, { fontSize: '32px', fill: 'yellow' });
		fianlScore.anchor.setTo(0.5);
		gameOverText = this.game.add.text(this.game.world.centerX,this.game.world.centerY - fianlScore.height, 'GAME OVER', { fontSize: '32px', fill: 'red' });
		gameOverText.anchor.setTo(0.5);
		//restart button
		restart=this.game.add.sprite(this.game.world.centerX,this.game.world.centerY + fianlScore.height+10,'restart');
		restart.anchor.setTo(0.5);
		restart.scale.setTo(0.05,0.05);
		restart.inputEnabled = true;
		restart.events.onInputDown.add(restartGame, this);
		game.time.events.stop();
	}, this);

}
//runs when ship collide power1
function s_power1_collide(ship,power){
	power.kill();
	game.time.events.remove(fireLoop);
	fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/10, fireBullet, this);
	game.time.events.add(Phaser.Timer.SECOND * 10, function(){
		game.time.events.remove(fireLoop);
		fireLoop=game.time.events.loop(Phaser.Timer.SECOND*1/buttetSpwanSpeed, fireBullet, this);
	},this);



}


function changeEnemySpeed()
{	
	if(enemySpeed<=900)
	{
		enemySpeed+=5;
	}
	if(enemySpwanSpeed<=3)
	{
		enemySpwanSpeed+=0.025;
	}
	enemyLoop.delay=Phaser.Timer.SECOND*1/enemySpwanSpeed;
}

//send power up
function powerFun()
{
	x1=game.rnd.integerInRange(0,this.game.world.width);
	x2=game.rnd.integerInRange(0,this.game.world.width);
	power=this.game.add.sprite(x1,10,'power1');
	power.anchor.setTo(0.5);
	var shine=power.animations.add('shine');
	power.animations.play('shine',5,true,true);
	power.checkWorldBounds = true;
	power.outOfBoundsKill = true;
	powers.add(power);
	game.physics.arcade.enable(power);
	power.body.collisonWorldBounds=true;
	game.physics.arcade.moveToXY(power, x2, this.game.world.height+power.height, 400,0);
	powerDelay=game.rnd.integerInRange(20,35);
	powerUp.delay=Phaser.Timer.SECOND*powerDelay;
}



function restartGame(){
	setStart();
	game.time.events.start();
	game.state.start("PreGameState");	
}



game.state.add("GameState",GameState);
game.state.add("BootState",BootState);
game.state.add("LoadingState",LoadingState);
game.state.add("PreGameState",PreGameState);
game.state.start("BootState");

 

main.js

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...