Как я HTML5-игру с OpenFL делал (и наплодил больше багов, чем там было самой игры)

В этом посте я собрал список проблем, с которыми столкнулся при разработке простой HTML5-игры на связке Haxe-OpenFL-Box2D. И самому себе на будущее, и кому-нибудь, может, тоже пригодится.

В первую очередь дисклеймер: мои руки растут из жопы, я плохо разбираюсь в OpenFL и Haxe в целом. Я понимаю, что это опенсорс и «если что-то не устраивает — возьми и почини сам». Также я очень благодарен всему русскому сообществу Haxe за неоднократные консультации и помощь!

На киевском DevGamm 2013 я хотел штурмовать Speed Game Dating, и для этого на пару с художником мы сделали за две недели Cake Break — Box2D-физпаззл на флеше. Времени было немного, поучаствовать хотелось, а игры такого плана делаются как раз быстро.

Спонсоры, глядя на игру, с равнодушным лицом отвечали: «Meh», добавляя, что вот если бы она была на модном HTML5 — то было бы, конечно, совсем другое дело, и что как только её портирую — сразу идти к ним.

Не вопрос! Откопал Haxe, сделал «haxelib install box2d», восхитился: «Как же легко портировать с флешика на хакс! Вот буквально только int на Int заменить и void на Void!», наивно полагая, что раз работает на десктопе и айпаде, то и везде будет работать. Как же я был наивен.



Спилы, как и обещали на девгамме, взялись спонсировать игру. Предложили $800, а я со своим нулевым навыком торговли сразу же согласился, рассчитывая, что «это просто первый эксперимент, а дальше будем эти HTML5 клепать по десятку в неделю и продавать по две тыщи!». Получил деньги, отправил игру на их QA, и стал получать багрепорты. Устранив проблему, переотправлял игру, и получал очередное письмо «QA failed» с новой проблемой.

Кстати, некоторые вещи уже, возможно, неактуальны и были исправлены в последних версиях OpenFL.

Игра грузится через раз, не выдавая никаких ошибок.

В каталоге с ассетами лежало штук 80 спрайтов с персонажами и UI («Мама, смотри, я не умею в спрайтшиты»), и трейс в прелоадере показал, что из них загружается, скажем, 78. Причём, через раз и не на всех устройствах. Может, это из-за хостинга; может, из-за браузеров. Уменьшить количество ассетов помогло.

Вываливается на iPhone 4/4s

Если зайти в Settings > General > About > Diagnostics & Usage > Diagnostics & Usage Data — видим запись о LowMemory. Помогло убрать некритичные элементы интерфейса и спрайты, а оставшиеся сжать с помощью tinypng.com/

IE9 — игра не запускается

Ни ошибок в консоли, ничего. Просто пустая полоса загрузки. Так и не поняв в чём дело, убрал bitfive, перейдя на то, что OpenFL предлагает по умолчанию. Проблема ушла, сменившись на…

…IE9: Float32Array is not defined

Об этом я писал отдельный пост. Чинится быстро, хоть и предложенный мной вариант решения напоминает ремонт техники, после которого остаются «лишние» детали. Но пока что ничего не отвалилось и не взорвалось мне прямо в лицо — так что и фиг с ним.

Не запускается в IE9 без открытой консоли

Забавная проблема. Пока не убрал из сгенерированного .js файла все вызовы console.log() — игра не запускалась в IE9 без открытой developer console.

Нативный браузер Android: изображение двоится

Выглядит так:



Андрей Винчковский подсказал, что проблема вызвана overflow:hidden на самой странице с игрой. Убрал — и стало отлично.

Нативный браузер Android: вкладка с игрой крешится после выбора уровня

Здесь стало хуже: вкладка стокового браузера на некоторых Android-устройствах натурально крешилась через пару секунд после начала уровня без каких-либо внятных уведомлений об ошибке. На десктопе, в Safari и в Chrome на андроиде всё было нормально.

Убрал всю графику из игры, события на клики/тапы, уменьшил фреймрейт — продолжало валиться. Однако заработало как только закомментил строку _b2dWorld.update().

Игра валилась именно из-за метода update в Box2D. Причём, если закомментировать в методе половину строк (разумеется, физика начинала вести себя чёрт-те как, но я пытался понять, чтО крешит браузер), то выпадение могло произойти не через 1-2 секунды, а через полминуты-минуту. Но валилось всё равно.

Безрезультатно попробовав заменить движок на более старую версию с GitHub, плюнул и прикрутил Nape вместо Box2D. Оказалось, что основы у обоих движков очень похожи и базовые вещи переносится с одного на другой легко и приятно.

В принципе, никаких страшных багов не было. Каждый из них, по большому счёту, чинится за пару часов — и следующую HTML5-игру на OpenFL я буду делать, просто вооружившись этим своим постом-чеклистом, сделанным при содействии великолепного QA Спилов — земной поклон этим ребятам, терпеливо проверявшим все 5347856348 билдов игры.