Migrating a PhoneGap iOS app to Android - experiencing terrible performance issues

Question

We have been working for several months on a fairly substantial iOS app using PhoneGap 1.8.1 and Kendo UI from Telerik. I would say the iOS app is about 90% as fast as its native equivalent which is perfectly acceptable for us. We took the same exact codebase and substituted in the Android equivalent javascript files, booted up our device (Motorola Xoom running 4.0.3), and performance is just awful. The worst of it is the page transitions - which should take maybe 0.3 seconds - take 2-5 seconds. Performance is same if not worse on the emulators (no surprise there).

If there is helpful code I could post, please let me know. Otherwise I guess we are looking for other people who have run into this situation and/or suggestions for performance improvements. At this point PhoneGap is a complete non-starter for Android development for us.

Answer 1

We do some cross-platform mobile development using Sencha Touch 2 (no experience with Kendo UI). The last time I looked into performance in detail, Sencha Touch 2 was the best performing of the full-featured/mature cross-platform mobile frameworks (Jquery Mobile, Kendo UI, etc.). Our experience is that the performance on Android is considerably slower than iOS (even though Sencha Touch 2 is considered kinda fast). Scrolling lists, screen transitions, etc. are all sub-par. I was rather astounded at the performance difference. The Android performance is better on my Galaxy Nexus running 4.0, but still noticeably slower than iOS devices.

Unfortunately, I don't see a way for you to get your apps to perform the same on Android as on iOS. This is the unfortunate reality that I came to a while back. The issue you're seeing is due to performance of the browsers on the different platforms; phonegap just uses UIWebView and WebView to load the html and javascript pages inside a native app wrapper. Can you load the Kendo UI app in the browser on the devices? I'm assuming the performance would be the same as the native-wrapped apps.

Our "solution" has been to develop for Android first and get the apps to a point where they perform decently. Then we know they'll be great on iOS devices.

I'm not very familiar with Kendo UI, but as far as recommendations or tweaks, we try to keep as little in the DOM as possible. When the app starts, we create as little in the DOM as possible, then create/destroy objects as the app needs them. Also, just general optimization of the javascript helps.

I think this is a dirty little secret of these mobile frameworks. When you approach them about it, their answer is that the Android browser performance is slow, so the apps are going to be slow. I.e. "not our fault", yet they continue to portray a framework that works great on all platforms.

For us, Sencha Touch 2 is fast enough where it gives our users a decent experience on Android devices, so it's worth the enormous time savings vs. developing natives apps for each platform.

Just to clarify, the performance issue you're seeing likely has nothing to do with PhoneGap, it's the browser performance on the devices. PhoneGap essentially just wraps a WebView in a native app wrapper. We have seen the performance issues on Android when using both PhoneGap and the Sencha Touch native packaging.