如何提高遊戲性能？

Question

我必須構建一個android應用程序遊戲。

以前，我試圖用pixi.JS建造它，但它並不適用於Android的工作很好的畫布上..

實際上，我試圖用CollieJS打造它，我簡單例如這裏：

<script type="text/javascript"> 

    var stats = new Stats(); 
     stats.setMode(0); // 0: fps, 1: ms 

     // Align top-left 
     stats.domElement.style.position = 'absolute'; 
     stats.domElement.style.left = '0px'; 
     stats.domElement.style.top = '0px'; 

     document.body.appendChild(stats.domElement); 

     setInterval(function() { 

      stats.begin(); 

      stats.end(); 

    }, 1000/60); 

     //Creation calque 
     var layer = new collie.Layer({ 
      width: 1280, 
      height: 700 
     }); 

     var score = 0; 
     var thisManyDb=10; 
     var comboCounter=0; 
     function letWinSomePoints(){ 
      score+=thisManyDb; 
      comboCounter++; 
      txt_score.text(score+"dB"); 
      txt_ComboCounter.text("Combo: "+comboCounter); 
     }; 

     //Chargement de la planche 
     collie.ImageManager.add({ 
      sprite_bassiste: "assets/img/spriteBass2.png", 
      sprite_batteur: "assets/img/spriteDrummer2.png", 
      sprite_guitF: "assets/img/spriteGuitF2.png", 
      sprite_guitH: "assets/img/spriteGuitH.png" 
     }); 

     //Découpage de la planche 
     collie.ImageManager.addSprite(
      "sprite_bassiste", { 
       normal:[0,0,187,268,3], 
       normal_rose:[561,0,186,268,3], 
       normal_click:[0,268,264,394,3], 
       occupe:[0,662,215,283,3], 
       occupe_rose:[645,662,215,283,3], 
       occupe_rouge:[0,945,215,283,3], 
       combo:[0,1223,277,309,3] 
      } 
     ); 
     collie.ImageManager.addSprite(
      "sprite_batteur", { 
       normal:[0,0,297,297,3], 
       normal_rose:[891,0,297,295,3], 
       normal_click:[0,297,273,376,3], 
       occupe:[819,339,356,334,3], 
       occupe_rose:[0,662,356,334,3], 
       occupe_rouge:[1068,662,356,334,3], 
       combo:[0,1007,297,306,3] 
      } 
     ); 
     collie.ImageManager.addSprite(
      "sprite_guitF", { 
       normal:[0,0,216,265,3], 
       normal_rose:[648,0,216,265,3], 
       normal_click:[0,265,351,372,3], 
       occupe:[0,637,216,265,3], 
       occupe_rose:[648,637,216,265,3], 
       occupe_rouge:[0,902,216,265,3], 
       combo:[0,1167,281,309,3] 
      } 
     ); 
     collie.ImageManager.addSprite(
      "sprite_guitH", { 
       normal:[0,0,174,219,3], 
       normal_rose:[522,0,174,279,3], 
       occupe:[0,280,269,256,3], 
       occupe_rose:[0,535,269,256,3], 
       occupe_rouge:[0,791,269,256,3], 
       normal_click:[0,1047,309,376,3], 
       combo:[0,1423,283,309,3] 
      } 
     ); 

     //Creation d'un objet 
     var bassiste = new collie.DisplayObject({ 
      width: 187, 
      height: 268, 
      y:0, 
      x:0, 
      backgroundImage: "sprite_bassiste", 
      spriteSheet : "normal", 
      set_normal:function(){ 
       bassiste.set("spriteSheet", "normal"); 
       bassiste._htOption.height=268; 
       bassiste._htOption.width=187; 
       bassiste._htOption.x=0; 
       bassiste._htOption.y=0; 
      }, 
      set_occupe:function(){ 
       bassiste.set("spriteSheet", "occupe"); 
       bassiste._htOption.height=283; 
       bassiste._htOption.width=215; 
       bassiste._htOption.x-15;//(-15) 
       bassiste._htOption.y=2;//(+2) 
      }, 
      set_occupe_rose:function(){ 
       bassiste.set("spriteSheet", "occupe_rose"); 
       bassiste._htOption.height=283; 
       bassiste._htOption.width=215; 
       bassiste._htOption.x-15;//(-15) 
       bassiste._htOption.y=2;//(+2) 
      }, 
      set_combo:function(){ 
       bassiste.set("spriteSheet", "combo"); 
       bassiste._htOption.height=309; 
       bassiste._htOption.width=277; 
       bassiste._htOption.x-40;//(-40) 
       bassiste._htOption.y-20;//(+20) 
      }, 
      }).attach({ 
       click: function (e){ 
        if (bassiste.get("spriteSheet")=="normal_rose" && has_been_clicked==false) { 
         has_been_clicked=true; 
         bassiste.set("spriteSheet", "normal_click"); 
         bassiste._htOption.height=394; 
         bassiste._htOption.width=264; 
         bassiste._htOption.x-=55;//(-40) 
         bassiste._htOption.y-=126;//(-126) 
         letWinSomePoints(); 
         setTimeout(function(){ 
          bassiste._htOption.set_normal(); 
          has_been_clicked=false; 
         },500); 
        }; 
       } 
      }).addTo(layer); 
     var batteur = new collie.DisplayObject({ 
      x:187, 
      y:0, 
      width: 297, 
      height: 297, 
      backgroundImage: "sprite_batteur", 
      spriteSheet : "normal", 
      set_normal:function(){ 
       batteur.set("spriteSheet", "normal"); 
       batteur._htOption.height=297; 
       batteur._htOption.width=297; 
       batteur._htOption.x=187; 
       batteur._htOption.y=0; 
      }, 
      set_occupe:function(){ 
       batteur.set("spriteSheet", "occupe"); 
       batteur._htOption.height=334; 
       batteur._htOption.width=356; 
       batteur._htOption.x-=73;//-73 
       batteur._htOption.y-=39;//-39 
      }, 
      set_occupe_rose:function(){ 
       batteur.set("spriteSheet", "occupe_rose"); 
       batteur._htOption.height=334; 
       batteur._htOption.width=356; 
       batteur._htOption.x-=73;//-73 
       batteur._htOption.y-=39;//-39 
      }, 
      set_combo:function(){ 
       batteur.set("spriteSheet", "combo"); 
       batteur._htOption.height=306; 
       batteur._htOption.width=297; 
       batteur._htOption.x=187;//pas de modifs position 
       batteur._htOption.y=0; 
      }, 
      }).attach({ 
       click: function (e){ 
        if (batteur.get("spriteSheet")=="normal_rose" && has_been_clicked==false) { 
         has_been_clicked=true; 
         batteur.set("spriteSheet", "normal_click"); 
         batteur._htOption.height=376; 
         batteur._htOption.width=273; 
         batteur._htOption.y-=84;//-84 
         batteur._htOption.x+=16;//+16 
         letWinSomePoints(); 
         setTimeout(function(){ 
          batteur._htOption.set_normal(); 
          has_been_clicked=false; 
         },500); 
        }; 
       } 
      }).addTo(layer); 
     var guitF = new collie.DisplayObject({ 
      x:187+297, 
      y:0, 
      width: 216, 
      height: 265, 
      backgroundImage: "sprite_guitF", 
      spriteSheet : "normal", 
      set_normal:function(){ 
       guitF.set("spriteSheet", "normal"); 
       guitF._htOption.height=265; 
       guitF._htOption.width=216; 
       guitF._htOption.x=187+297; 
       guitF._htOption.y=0; 
      }, 
      set_occupe:function(){ 
       guitF.set("spriteSheet", "occupe"); 
       guitF._htOption.height=265; 
       guitF._htOption.width=216; 
       guitF._htOption.x+=21;//+21 
      }, 
      set_occupe_rose:function(){ 
       guitF.set("spriteSheet", "occupe_rose"); 
       guitF._htOption.height=265; 
       guitF._htOption.width=216; 
       guitF._htOption.x+=21;//+21 
      }, 
      set_combo:function(){ 
       guitF.set("spriteSheet", "combo"); 
       guitF._htOption.height=309; 
       guitF._htOption.width=281; 
       guitF._htOption.x-=32;//+32 
       guitF._htOption.y-=44;//+44 
      }, 
      }).attach({ 
       click: function (e){ 
        if (guitF.get("spriteSheet")=="normal_rose" && has_been_clicked==false) { 
         has_been_clicked=true; 
         guitF.set("spriteSheet", "normal_click"); 
         guitF._htOption.height=372; 
         guitF._htOption.width=351; 
         guitF._htOption.y-=96;//-96 
         guitF._htOption.x-=67;//-67 
         letWinSomePoints(); 
         setTimeout(function(){ 
          guitF._htOption.set_normal(); 
          has_been_clicked=false; 
         },500); 
        }; 
       } 
      }).addTo(layer); 
     var guitH = new collie.DisplayObject({ 
      x:187+297+216, 
      y:0, 
      width: 174, 
      height: 279, 
      backgroundImage: "sprite_guitH", 
      spriteSheet : "normal", 
      set_normal:function(){ 
       guitH.set("spriteSheet", "normal"); 
       guitH._htOption.height=279; 
       guitH._htOption.width=174; 
       guitH._htOption.x=187+297+216; 
       guitH._htOption.y=0; 
      }, 
      set_occupe:function(){ 
       guitH.set("spriteSheet", "occupe"); 
       guitH._htOption.height=256; 
       guitH._htOption.width=269; 
       guitH._htOption.x-=19;//-19 
       guitH._htOption.y+=12;//+12 
      }, 
      set_occupe_rose:function(){ 
       guitH.set("spriteSheet", "occupe_rose"); 
       guitH._htOption.height=256; 
       guitH._htOption.width=269; 
       guitH._htOption.x-=19;//-19 
       guitH._htOption.y+=12;//+12 
      }, 
      set_combo:function(){ 
       guitH.set("spriteSheet", "combo"); 
       guitH._htOption.height=309; 
       guitH._htOption.width=283; 
       guitH._htOption.x-=71;//-71 
       guitH._htOption.y+=22;//+22 
      }, 
      }).attach({ 
       click: function (e){ 
        if (guitH.get("spriteSheet")=="normal_rose" && has_been_clicked==false) { 
         has_been_clicked=true; 
         guitH.set("spriteSheet", "normal_click"); 
         guitH._htOption.y-=76;//76 
         guitH._htOption.x-=102;//102 
         guitH._htOption.height=376; 
         guitH._htOption.width=309; 
         letWinSomePoints(); 
         setTimeout(function(){ 
          guitH._htOption.set_normal(); 
          has_been_clicked=false; 
         },500); 
        }; 
       } 
      }).addTo(layer); 
     var txt_score = new collie.Text({ 
      width : 100, 
      height : 100, 
      x : 0, 
      y : 0, 
      fontColor : "#000000" 
     }).text(score+"dB").addTo(layer); 

     var txt_DbCounter = new collie.Text({ 
      width : 100, 
      height : 100, 
      x : 100, 
      y : 0, 
      fontColor : "#000000" 
     }).text('').addTo(layer); 

     var txt_ComboCounter = new collie.Text({ 
      width : 100, 
      height : 100, 
      x : 200, 
      y : 0, 
      fontColor : "#000000" 
     }).addTo(layer); 

     //Définition de l'anim du sprite 
     var timer = collie.Timer.cycle(
      bassiste, "10fps", { 
      from:0, 
      to:2, 
      } 
     ); 
     collie.Timer.cycle(
      batteur, "10fps", { 
      from: 0, 
      to: 2, 
      } 
     ); 
     collie.Timer.cycle(
      guitF, "10fps", { 
      from: 0, 
      to: 2, 
      } 
     ); 
     collie.Timer.cycle(
      guitH, "10fps", { 
      from: 0, 
      to: 2, 
      } 
     ); 

     var choosen_musician = 0; 
     var busy_musican = 0; 
     var trap_musician = 0; 
     var has_been_clicked = false; 

     // Fonction boucle intégrée dans collie 
     collie.Timer.repeat(function() { 
      //Pioche un musicien 
      choosen_musician=Math.round(Math.random()*3); 
      busy_musican = Math.round(Math.random()*10); 
      trap_musician = Math.round(Math.random()*20); 

      if (busy_musican==0 && busy_musican!=choosen_musician) { 
       busy_musican=bassiste; 
      } else if (busy_musican==1 && busy_musican!=choosen_musician){ 
       busy_musican=batteur; 
      } else if (busy_musican==2 && busy_musican!=choosen_musician){ 
       busy_musican=guitF; 
      } else if (busy_musican==3 && busy_musican!=choosen_musician){ 
       busy_musican=guitH; 
      }; 

      if (choosen_musician==0) { 
       choosen_musician=bassiste; 
      } else if (choosen_musician==1){ 
       choosen_musician=batteur; 
      } else if (choosen_musician==2){ 
       choosen_musician=guitF; 
      } else if (choosen_musician==3){ 
       choosen_musician=guitH; 
      }; 

      // On change son sprite, bug lorsqu'on met un sprite "fixe" 
      choosen_musician.set("spriteSheet", "normal_rose"); 
      if (busy_musican._htOption) {busy_musican._htOption.set_occupe()}; 

      setTimeout(function(){ 
       if (has_been_clicked==false) { 
        choosen_musician._htOption.set_normal(); 
        //comboCounter=0; 
       }; 
       if (busy_musican._htOption) {busy_musican._htOption.set_normal();}; 
      },2000); 

     }, 2500); 


     //On render tout ça 
     collie.Renderer.addLayer(layer); 
     collie.Renderer.load(document.getElementById("container")); 
     collie.Renderer.start(); 

    </script> 

我知道這是一個很長的例子，但我需要一些幫助..

這是一個簡單的動畫精靈與精靈的一些開關。

事實上，本場比賽在我的Android平板電腦在4-6 FPS運行，我不知道爲什麼..

Answer 1

開始在Android 3.0的（API級別11），Android的2D渲染管線支持硬件加速，這意味着在視圖畫布上執行的所有繪圖操作都使用GPU。由於啓用硬件加速所需的資源增加，您的應用程序將消耗更多的RAM。

在你的Android清單文件，下面的屬性添加到標籤啓用硬件加速整個應用程序：

<application android:hardwareAccelerated="true" ...> 

有關硬件加速訪問的詳細信息，下面的鏈接：Hardware Acceleration