使用HTML和JS的iPhone游戏中的性能问题,以及appMobi

Question

在使用Java为Android创建一些游戏后,我正在使用appMobi制作我的第一款游戏.我基本上打算创建一个无尽的亚军街机游戏,2D,顶视图.

我正在使用带有普通JS和CSS3的appMobi(没有任何其他库,如Impact).

我开始用画布做一些测试并创建了一个非常简单的演示,你用加速度计控制一个球(基本上是用帆布渲染的圆圈)并需要收集其他球.我用我的Galaxy S2和iPhone 4进行了测试,看起来iPhone运行起来要好得多,所以我开始编写一个简单的引擎来代替使用dom元素.我基本上创建一个连接到一个标签,并保持一个位置矢量的对象,还增加了一个绘制函数,基本上执行以下操作:this.element.style.left = X +"像素"(与同为顶和y).

在我的主循环中,我在对象上调用了draw函数并根据我的游戏逻辑更新了它们的位置,并使用此window.requestAnimationFrame包装器重新调用mainLoop:

window.requestAnimFrame = (function(){
       return  window.requestAnimationFrame       || 
              window.webkitRequestAnimationFrame || 
              window.mozRequestAnimationFrame    || 
              window.oRequestAnimationFrame      || 
              window.msRequestAnimationFrame     || 
              function( callback ){
                window.setTimeout(callback, 1000 / 60);
              };
    })();

然后我继续创建一个相机对象来控制屏幕定位,并使用css background-position属性成功滚动背景.我用新的Galaxy s3测试了它,并在s2上测试了一些图形(2 200x200 pngs和背景),一切都以~60 fps的速度运行.我对结果感到非常满意,并且非常高兴能够在iPhone 4 iOS 4.x上进行测试,但令我失望的是它以2-3 FPS运行!比我的机器人慢30倍.我开始做了很大的改变(我目前使用的720x1280视口),所以我一直在使用320*480的尝试,用帆布代替,去除滚动的背景,调整图像大小,但无济于事,而Android表现不错的所有变化.

我得到的最好是5 FPS.我有另外一部iPhone要测试,iPhone 4S和iOS5并且非常不稳定的FPS.范围从3到50但是无法播放 - 没有人有机会玩它,我甚至没有开始用内容打包它.

我真的想利用跨平台的优势,放弃Apple市场会让我感到羞耻,所以任何提示或建议都会受到热烈欢迎!

谢谢,加布里埃尔

Answer 1

这是我在 appMobi 论坛上得到的答案，如果有人遇到这个问题：

使用直接画布

无论如何，JS/CSS3 在所有设备上都会表现得很糟糕。iOS (Safari) 中的原生浏览器启用了 NitroJS，但 UIWebView 中没有启用...但是如果您有时间，请阅读一下，您会发现如果不利用 Direct 等硬件加速，就无法编写 JS 游戏帆布。