Sencha Touch 2 - Prestazioni Android

Question

Stiamo sviluppando un'applicazione Sencha Touch 2 che fa uso di PhoneGap per poterlo installare come applicazione e accedere all'archiviazione di un dispositivo. Funziona molto bene su iPad 2 e iPad 3. Tuttavia, quando abbiamo provato a eseguire l'applicazione su un dispositivo Android, le prestazioni erano molto lente. Gli elementi principali che hanno rallentato il sistema sono stati elenchi e caroselli. Quando abbiamo provato a testare la stessa applicazione tramite il browser Chrome, le prestazioni erano in linea con quelle dell'iPad.

Avete qualche suggerimento su cosa possiamo fare per migliorare le prestazioni su Android, magari anche abbandonando PhoneGap per qualcosa che funzioni meglio. O se possiamo forzare l'invio di fonegap come browser Chrome.

Grazie per il vostro tempo & aiuto.

Answer 1

Il problema che si verifica qui è che il browser Android non utilizza l'accelerazione dell'hardware grafico. Ciò significa che i trucchi standard che Sencha (e altre librerie HTML5 come jQueryMobile, iScroll etc ...) usano per fornire buone prestazioni di scorrimento, come le trasformazioni CSS 3D, per fare in modo che il tuo elenco sia reso in un livello separato, che può quindi essere tradotto in hardware, non funzionerà su Android. Invece, la lista di scorrimento sarà eseguita interamente nel software, che sarà lento!

Il browser Chrome, tuttavia, fornisce l'accelerazione GPU. Il dispositivo Android è più che capace di offrire una buona esperienza HTML5, è semplicemente che il browser standard non sfrutta ancora l'hardware della GPU.

A meno che non si possa costringere gli utenti finali a utilizzare Chrome (cosa di cui dubito), l'unica opzione è quella di degradare l'esperienza utente e fornire un'interfaccia utente leggermente più semplice per gli utenti Android.

Per ulteriori dettagli, vedere "IMPROVING THE PERFORMANCE OF YOUR HTML5 APP"

Answer 2

provare ad impostare questo flag nella tua AndroidManifest.xml: Android: hardwareAccelerated = "true"

Answer 3

Aggiornamento: Avendo lavorato con ST2 più lunga ora le prestazioni le sfide su Android sono solo qualcosa che devi accettare. Ci sono molte cose che puoi fare per evitare problemi di prestazioni come ridurre gli ascoltatori e gli eventi, mantenere il DOM leggero (sotto i 2000 nodi) e in generale evitare trasformazioni ed effetti CSS3 (questi in particolare non funzionano bene su Android)

Un'altra cosa da considerare è piuttosto che usare la WebView integrata, è possibile utilizzare il browser CrossWalk e incorporarlo in APK.

https://crosswalk-project.org

Si aggiunge un po 'formato al vostro APK (15-20MB), ma si comporta meglio del costruito in WebView e porta stabilità e coerenza ad una piattaforma molto frammentato. Considera la realtà che ogni WebView su Android a seconda del dispositivo, del fornitore e della versione del sistema operativo può essere diversa in modi piccoli. CrossWalk ti permetterà di avere la stessa identica versione su tutti i dispositivi Android 4.0 e rimuovere qualsiasi problema specifico del dispositivo o del produttore.

Non esiste un proiettile d'argento per le prestazioni su Android. L'accelerazione grafica non migliorerà l'esecuzione della pura esecuzione di javascript o della manipolazione del DOM.Se si vuole capire perché, allora cominciare da qui:

What's the difference between reflow and repaint?

risposta Più (può essere ancora valido):

Per ICS e soprattutto la seguente impostazione sul WebView migliorerà in modo significativo le prestazioni di rendering per Sencha touch Android:

mWebView.setLayerType(WebView.LAYER_TYPE_HARDWARE, null); 

Tuttavia nella mia esperienza questo introdurrà manufatti in di rendering CSS a seconda delle condizioni va dispositivo e piattaforma riation. Non ho trovato una ragione specifica per questo e non mi aspetto che Google lo risolva poiché il componente webview verrà sostituito con una versione nuova e migliore di Android 4.4.

https://developers.google.com/chrome/mobile/docs/webview/overview