为什么移相器游戏落后于移动设备

Question

我正在使用Phaser创建我的第一个游戏，它在桌面上运行良好。 但它在Android手机上却落后了。

谁能告诉我可能是什么原因？

游戏非常小 小于2mb。 游戏中使用的图像也非常小。 无论如何都要找出我的代码中的任何泄漏。

我的主要js文件。

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");

由于游戏规模太小，我认为它应该可以在移动设备上顺利运行。 它在一些高端移动设备上运行良好，但随着时间的推移变慢。 这是我的第一款游戏，所以我对游戏设计概念不是很了解。

Answer 1

在手机中，处理能力低于桌面。

通常，移动Cpu的架构通常经过优化以节省能源。当您在桌面上时，x86或x64架构已针对数据处理进行了优化。

因此，在目标设备上测试应用程序的性能非常重要。

您需要在游戏进行时减少对象的创建，加载图像或对象。我有更好的经验，我的游戏只是隐藏和显示相同的对象（敌人），而不是破坏对象（敌人或视觉元素），并在游戏时再次创建。因为当游戏创建新实例时，CPU再次加载相同的内容。这种变化在高CPU中没有差别，但在低CPU时却更好。也许它可以帮到你。

Answer 2

如果它在您的桌面上运行正常，则很可能是资产规模过大的问题。减少所有资产的1/2。 Phaser必须将所有资源加载到缓存中，然后减少引擎中这些文件的像素大小。

Answer 3

您好，我目前已经将此问题修复为我的游戏跨平台。

我做的事情是

在我的主屏幕/或加载屏幕上加载alll sprite 如果你有可重复使用的精灵使用命令.kill（）而不是.destory（）这将需要更多的内存来重新加载精灵，除非精灵没有回到屏幕然后它可以销毁。 回收所有东西，让我们说你使用一颗子弹，因为它击中了墙壁的轰击并将其取回。

在某些情况下可悲的部分，即使有时它仍然会滞后并且在这里和那里有一些小故障，你只需要看看发生了什么。使用断点来准确查看精灵导致的精灵，并考虑图像是否具有透明度以使用.jpeg

祝你好运，希望这会有所帮助