Developing game app using Phaser.js and Ionic (slow/shaky rendering)
Just to let you know (in case someone wants to develop).
I developed a game app using Phaser.js. I sort of put the code into Ionic blank starter app. So basically the view is rendered using Ionic app and then Phaser picks up the div by the id and displays the game.
Problem:
Its a simple flappy bird clone. Its working fine but the blocks movement is a bit shaky (as though they were shivering). Since Phaser uses WebGL, could it be the reason for slow rendering or is it due to the ionic framework (/angularjs) ?
Should I have used some other tools to build the game app?
Thanks in advance.
Edit:
You can checkout the code here: https://github.com/vamshisuram/ionic-flappybird-clone.git I uploaded all code into Git. So, I guess you can directly install platforms/ant-build/Hello-Cordova-debug.apk into your mobile and test it. Or try build again and install.
Answer
You can make it work. BUT ... there is no support for WebGL on any Android device using the stock webview (Ionic uses Cordova to package the app which is then being run inside a webview on the device): http://caniuse.com/#feat=webgl
Phaser.js is built on top of Pixie.js which will fall back to 2D canvas rendering. That's why your game is running slow.
If you want to use Ionic and WebGL you should build your app using CrossWalk. I have done that and it is awesome: https://crosswalk-project.org/
There's other options such as CocoonJS to get WebGL going, but I haven't used those myself.