9

I developed an application for android using jquery mobile and phonegap. I deployed the app to my device over usb. The performance of the app ist really bad, especially while scrolling a longer list.

The strange thing is: The whole app runs smooth if i just open up the browser on my phone and access the index.html directly. Same technology, same content. I do not use the phonegap native api or anything similar.

Tested with phonegap 1.5.0 and 1.7.0rc1, jquery mobile 1.1.0 on android 4.0.2.

Any ideas?

rbk
  • 101
  • 1
  • 1
  • 3
  • Assuming both are using the system webkit library, it would seem to be either different configuration settings or additional add ons in one environment or the other, or else something odd in your code that challenges one but not the other. Might be interesting to point both at a javascript benchmark site – Chris Stratton Apr 28 '12 at 16:39
  • I'm just curious how big of a list we are talking about here? – codaniel Apr 28 '12 at 21:15
  • @codaniel: about 50 elements with thumbnails – rbk Apr 29 '12 at 16:59
  • @Chris: I dont use any plugins or code that just runs in phonegap – rbk Apr 29 '12 at 17:00
  • You might not have any, but the browser may well have extensions to/ overrides of the system webview functionality - that's what your link speculates. But rule out problems in your javascript - point both at a benchmark site and see if you see evidence of a difference in performance on someone else's code. – Chris Stratton Apr 29 '12 at 17:14
  • I have the same experience not using any frameworks at all. The app works fine on iOS, but not on Android webview as a phonegap app. – Per Quested Aronsson Sep 28 '12 at 10:25

5 Answers5

11

On honeycomb (3.0), Ice cream (4.0) and posterior devices, you can boost performance by adding the following in the < Application ... > tag:

android:hardwareAccelerated="true"

You could set the minSdk to 8 (Android 2.2) for compatibility and the targetSdk to 15 (Android 4.0) and that would make hardware acceleration work when its available on the device only.

I believe that with this flag the performance of my apps is equal to running them in the browser, so I guess its because the browser was coded with hardware acceleration :)

alfongj
  • 2,255
  • 1
  • 19
  • 23
  • this worked for me as well. the specific issue I was having was around keyboard/typing performance when using Phonegap + FastClick + Android 4.1.1+ - typing performance was EXTREMELY laggy (no issues in the browser or in Android 2.3). enabling this flag solved the issue :-) – Maurice Apr 28 '13 at 05:25
  • Wow! it really perform MUCH better in my terrible Samsung with 2.3 – Toni Michel Caubet Nov 13 '13 at 19:10
2

I had a similar problem: a page with a longer list of "medium complex" themed divs. The browser of HTC phone had no problems in displaying. But within the phonegap app rendering failed completely. I saw a kind of WSOD, which disappeared only after touching the display. After touching, the page was displayed correct.

The problem was not in place, when I shortened the div-list to one or two div-elements or when I reduced the sub elements within the divs and reduced the render effort caused by the css complexity.

The white screen looked like, if the whole body was invisible, since only the documents background-color was displayed (I added a light pink for this). So I guess, the rendering was the problem after reading this thread

I tried the various proposals I found in this thread to make the app work without the "WSOD". But nothing worked. Some of them made the app displaying really worse.

Finally, after a whole day of searching, I made it. I set within the tag (not the tag) of my AndroidManifest

<application android:hardwareAccelerated="false" ...

Now the app behaves in the same fast way as my webbrowser. Seems like, if hardware acceleration is not always the best feature...

My versions: phonegap 3.5.0, Android 4.0.3, jQuery v2.1.0, HTC Sense 3.6

Community
  • 1
  • 1
user3595386
  • 192
  • 1
  • 6
1

Found an answer here: http://groups.google.com/group/phonegap/browse_thread/thread/94da1cf881abe995/6d4f7aea7aeba523?lnk=gst&q=performance

There is probably a difference between the native browser and the webview in terms of javascript performance.

rbk
  • 101
  • 1
  • 1
  • 3
0

If you can confirm the browser performs better (that it's not something suboptimal in your code frustrating one but not the other), you could consider deploying as an html5 offline application so that you will actually run in the browser.

Chris Stratton
  • 39,853
  • 6
  • 84
  • 117
0

We bumped into performance issues while scrolling the same amount of list items with jquery mobile. The performance was so poor (we didn't even try in PhoneGap environment) that we rewrote the app using iScroll library... now the app scrolls really smoothly.

If you are at the beginning of the development, you could try to change the UI library.

After this situation we deploy our apps to test devices quite often to manage performance issues in time... this became a "policy" :)

Peter Aron Zentai
  • 11,482
  • 5
  • 41
  • 71