I’ve packaged my angular/ionic app using Phonegap in order to deploy on Andriod and iOS. I am using ionic.js for most of the navigation and Angular for the app logic including some http calls to populate my views.
I’ve been using the Ripple Emuator during development and the performance has been great. No issues anywhere.
However, when I try to run the APK on an Android device, the application is very slow and laggy. Even the parts of the app that are not loading any external content get stuck easily.
The device itself is just an Android 4.2~ tablet we had in the office, but it seems to run native apps much faster.
Has anyone encountered similar performance issues when using Phonegap Build to package apps?
Should I ditch ionic.js in favor of a lighter-weight approach to transitions between screens? Because, like others have noted, the chokepoints seem to occur when switching between list and detail views. I am just hesitant because these problems do not appear at all when debugging in a desktop browser.
From experience, I’ve actually found Android to be the MOST performant, especially 4.4.2 (I think) because the stock webkit was switched out for the Chrome renderer. iOS has some issue because of it not having the same javascript engine as mobile Safari, but that will be fixed in iOS 8, giving an up to 40% increase to performance.
I know there are plans to add the new animation engine to Ionic that the team has been working on.
You may also consider prefetching/caching templates.
Yep, we’ve had heaps of performance problems with transitions on Android just going from list to detail. If the list is tiny, as in 10 or so rows, transitions seem bearable so perhaps you could try using collection repeat directive to limit the number of rows you hold in memory. Other than that, there is no easy solution.
Like gozinsa said… If you have a small DOM (a few list entries in the DOM) the performance is very good for a hybrid app i think. But there for you should implement in all lists the ionic collection-repeat.
And like andrew said: Android > 4.4.2 with the chromium engine is very fast. The old stock android browser is crap. Scrolling does not work smoothly and like expected, some base javascript functionalities does not work like expected like “new CustomEvent” and so on.
And if you load images from an external api -> be sure to activate image caching on server side
You can use AppGyver Steroids to make use of native UI rendering.
Steroids is built on top of Cordova, so you should be able to reuse most of your code.
AngularJS and Ionic are both used in the standart stack, however I can’t get Ionic to work here (Android 4.4.4).
Yeah but i think ionic will go in the same direction like appgyver…
It is more like a question: should you use appgyver or ionic ;).
With the incredible development speed of ionic (and what all happend behind the scenes - see app creator and so on) i would trust in ionic for the future.