Zippy1970

Creating an Android app: Speeding up the canvas (with Cordova?)

Recommended Posts

I've created a HTML5 2D canvas game and I'm now ready to take the step and convert it to a native Android (and iOS) app. The game works perfectly fine in any desktop or mobile browser. Animations are fast and smooth.

After some research, I decided Cordova was the way to go to create native apps for Android and iOS. My first priority is Android, simply because I have an Android phone myself and I don't have a Mac (which apparently is required to build iOS apps).

I have looked at Cocoon.io and although that might be an even better option than Cordova (since it's actually build on top of Cordova), the thing that made me run from it is the fact that it costs $500 just to remove the "build with Cocoon" splash screen...

After installing all prerequisites (cordova, Android Studio, nodes.js) building my first APK was easy.

When I ran my game in the Android emulator, the game was abysmally slow... Testing it on my device yielded the same slow results. After searching the internet, I figured it was because on some devices, an old and slow WebView is used by native apps to display HTML5 content. Still strange since my phone uses Android 7.0.0 and the emulator uses Android 8.0.0...

I quickly found FastCanvas, a PhoneGap/Cordova plugin that adds a very fast canvas "compatible" rendering surface. But it was last updated in 2013 and after trying to get it to work for almost 16 hours straight, I came to the conclusion there's no way to get this to work with the current version of Cordova.

I then found CrossWalk-WebView. This too was pretty old and a pain to get it to work with the current version of Cordova. And when I did get it to work, I quickly found out it created a few new problems making my game unplayable (noticeably a strange lag when touching the screen. Not the famous 300ms input lag, but after touching the screen, the entire game would freeze for 200ms-300ms). So I had to give up on Crosswalk as well.

So now I am at a loss. Can anyone offer me suggestions on how to speed up canvas rendering in Cordova? It's pretty darn frustrating that my HTML5 game is finished and I'm ready for publication, only to find out that's not as easy everyone says it is...

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.