Проблемы с производительностью в игре для iPhone с использованием HTML и JS, с appMobi

Я делаю свою первую игру с appMobi после создания некоторых игр для Android с использованием Java. Я в основном намереваюсь создать бесконечную аркадную игру, 2d, вид сверху.

Я использую appMobi с простым JS и CSS3 (без какой-либо другой библиотеки, такой как Impact).

Я начал с некоторых тестов с canvas и создал очень простую демонстрацию, в которой вы управляете шаром (в основном кругом, отображаемым с помощью canvas) с помощью акселерометра и должны собирать другие шары. Я протестировал его на своем Galaxy S2 и iPhone 4, и, похоже, iPhone работал намного лучше, поэтому я начал писать простой движок для использования элементов dom. Я в основном создал объект, который соединяется с тегом и содержит вектор положения, а также добавил функцию рисования, которая в основном выполняет следующее: this.element.style.left=x+'px' (и то же самое для top и y).

В моем основном цикле я вызвал функцию draw для объектов и обновил их местоположение в соответствии с моей игровой логикой, а затем повторно вызвал mainLoop с помощью этой обертки window.requestAnimationFrame:

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 кадров в секунду. Я был очень доволен результатами и действительно был взволнован, чтобы протестировать iPhone 4 на iOS 4.x, но, к моему разочарованию, он работал со скоростью 2-3 FPS! В 30 раз медленнее чем мой андроид. Я начал вносить много изменений (в настоящее время я использую область просмотра 720x1280), поэтому я попытался использовать 320*480, используя вместо этого холст, убирая фон прокрутки, изменяя размеры изображений, но безрезультатно, в то время как андроид хорошо работал на все варианты.

Лучшее, что я получил, было 5 FPS. Я испытал другой iPhone, iPhone 4S с iOS5 и получил очень и очень нестабильный FPS. варьировался от 3 до 50, но был неиграбельным - нет шансов, что кто-нибудь сыграет в него, и я даже не начал упаковывать его контентом.

Я действительно хочу воспользоваться кроссплатформенностью, и мне было бы стыдно отказаться от рынка Apple, поэтому любые советы и рекомендации будут тепло встречены!

Спасибо Гавриил

2 ответа

Это ответ, который я получил на форумах appMobi, если у кого-то есть такая проблема:

Использовать прямой холст

JS/CSS3 будет работать ужасно на любом устройстве, несмотря ни на что. В стандартном браузере в iOS (Safari) включен NitroJS, но не в UIWebView... но если у вас есть время, прочитайте, и вы увидите, что вы не можете написать игру JS без использования аппаратного ускорения, такого как Direct Холст.

Найдите несколько примеров и ссылок, чтобы начать работу с directCanvas здесь:

http://www.appmobi.com/documentation/index.php?DOC=DIRECTCANVAS_SDK

Другие вопросы по тегам