Tap events getting dropped, and other touch problems

[Stefan_Monov]

I'm testing my canvas app on an Android phone, and I have frequent problems with touch events when the framerate is low. The lower the framerate, the worse the problems get. They are:

1. Tap events get dropped (IOW, not received). This includes the three-finger tap for exiting into App Preview - it frequently doesn't work. [3]
2. Tap events get send to old positions. For example, I tap a button, then I tap another button, and the result of the second tap is that the first button gets pressed again. This happens like once or twice and then I start getting any following events at the correct positions.
3. Double-tapping never produces any mousedown [2] event, not even when the framerate is higher.

I'm drawing images with context.drawImage and text with context.fillText to it. Also some minor fillRect's.

The phone is a Huawei Ascend Y511, which might matter because it's a bit of a slow phone, making the framerate drop especially low.

A normal scene I'm testing in contains about 600 smallish images and almost no text. There are actually only about 30 different images but they get drawn a total of about 600 times per frame. You can try drawing them in "random" order because otherwise the drawing can become pretty fast and the touch problems will become very rare. See my post here [1] for how the drawing order affects performance.

The problems occur both when running the game in App Preview and when using an installed built version on the phone. When testing in desktop Google Chrome it works fine. It also works fine when testing my app in Google Chrome on the phone, which leads me to wonder whether the webview used by the XDK is the same as Google Chrome's.

Any hints?

XDK version: 2611

[1]: https://logixoul.wordpress.com/2015/11/04/html5-canvas-performance-sort-drawimage-calls-by-image/

[2]: I'm handling mousedown rather than touchstart because touchstart never gets fired for me for some reason.

[3]: The fact that it happens even for the three-finger tap means that the problem isn't in my code.

[PaulF_IntelCorp]

Please build using Crosswalk, that will get you a Chromium based webview like the one in your Chrome browser. The builtin webview on Android 4.x devices is inconsistent and slow.

[Stefan_Monov]

Thanks. I didn't know what Crosswalk is until now. In my initial testing it seems to have fixed all my touch problems, except, note, the double-tap one. Performance is now also much better.

Is there any reason to use a non-Crosswalk build for Android? What about Crosswalk builds for iOS and Windows - I don't see any such in the build platform list in the XDK, yet I expect that one might want to use those for the same reasons as for Android.

My reading of this is that App Preview will only use a Crosswalk webview when debugging over a USB cable. So in all other cases it will use a native webview?

What options are there to debug using a Crosswalk webview, when it's not possible to use a USB cable? (I have problems installing the ADB drivers on my PC, the Koush driver doesn't work for me probably because my phone is of an smaller brand - Huawei). I could build it and install it every iteration, but that's a lot of steps and time. And looking at this, it seems I have no other options and must resort to debugging in a native webview.

[PaulF_IntelCorp]

Stefan,

Glad to hear that Crosswalk helped with most of the problems you were having. To get touch to work the way you want you might have to investigate some touch libraries. Fastclick is one that might help, it's a JS library (not dependent on Cordova or Crosswalk).

For most apps there is very little value to using regular Android. However, you will find that the Android webview in Android 5+ is quite good. Android 4.4 is very functional but has so-so performance. Android 4.3 and lower is awful. The biggest problem most people have with Crosswalk is the size of their APK, due to the added Crosswalk library. We're trying to see if that can be reduced, but probably will only save about 5MB of space. You can look into the shared-mode library option, which works if you distribute via the Google Play store. Still requires the download, but has the drawback (like the Android 5+ webview) that the runtime gets updated outside of your control.

Yes, when using the Debug tab the webview is Crosswalk. Eventually, the non-USB version of App Preview will allow for running inside the Crosswalk webview, not just native. For now, the wireless App Preview uses the native webview on the device.

Getting that adb bridge driver working on Windows machines continues to be a major headache. I've done some work over the past few weeks to see if I can provide a better way to get it installed and working on a Windows machine. Still have to write it up and see if it helps.

Paul