Affichage Web Android lent

Mes android webviewssont lents. C'est sur tout, des téléphones aux 3.0+tablettes avec des spécifications plus que suffisantes

Je sais que webviews sont censés être « limité » mais je vois applications web fait avec espace de téléphone qui doit utiliser toutes sortes de CSS3et la JQuerysorcellerie, ils courent très bien et rapide

donc je manque quelque chose, y a-t-il une sorte de myWebview.SPEEDHACK(1)que je puisse utiliser pour accélérer les choses?

aussi, parfois le contenu de ma vue Web ne se charge tout simplement pas, au lieu de se charger lentement, il ne se charge pas. L'actif avec lequel je teste est stocké localement, sans erreur.

Cela dépend de l'application Web en cours de chargement. Essayez certaines des approches ci-dessous:

Définir une priorité de rendu plus élevée (obsolète à partir de l'API 18+):

webview.getSettings().setRenderPriority(RenderPriority.HIGH);

Activer / désactiver l'accélération matérielle:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    // chromium, enable hardware acceleration
    webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
    // older android version, disable hardware acceleration
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

Désactivez le cache (si vous rencontrez des problèmes avec votre contenu):

webview.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);

L'ajout de cela android:hardwareAccelerated="true"dans le manifeste était la seule chose qui a considérablement amélioré les performances pour moi

Plus d'informations ici: http://developer.android.com/guide/topics/manifest/application-element.html#hwaccel

La solution pour nous était le contraire. Nous avons désactivé l'accélération matérielle sur WebView uniquement (plutôt que sur l'ensemble de l'application dans le manifeste) en utilisant ce code:

if (Build.VERSION.SDK_INT >= 11){
    webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

Les animations CSS3 sont désormais plus fluides. Nous utilisons Android 4.0.

Plus d'informations ici: https://code.google.com/p/android/issues/detail?id=17352

Je pense que ce qui suit fonctionne le mieux:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    webView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
    webView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

Android 19 a le moteur Chromium pour WebView. Je suppose que cela fonctionne mieux avec l'accélération matérielle.

J'avais ce même problème et je devais le résoudre. J'ai essayé ces solutions, mais à la fin les performances, du moins pour le défilement ne se sont pas améliorées du tout. Voici donc le workaroud que j'ai effectué et l'explication de pourquoi cela a fonctionné pour moi.

Si vous avez eu la chance d'explorer un peu les événements de glissement, juste un peu, en créant une classe "MiWebView", en écrasant la méthode "onTouchEvent" et en imprimant au moins l'heure à laquelle chaque événement de glissement se produit, vous verrez qu'ils sont séparés à temps pour (jusqu'à) 9 ms. C'est un temps très court entre les événements.

Jetez un œil au code source WebView , et voyez simplement la fonction onTouchEvent. Il est tout simplement impossible qu'elle soit gérée par le processeur en moins de 9ms (Continuez à rêver !!!). C'est pourquoi vous voyez constamment le message "Manquez une traînée car nous attendons la réponse de WebCore pour l'atterrissage." message. Le code ne peut tout simplement pas être traité à temps.

Comment le réparer? Tout d'abord, vous ne pouvez pas réécrire le code onTouchEvent pour l'améliorer, c'est tout simplement trop. Mais, vous pouvez "vous moquer" afin de limiter le taux d'événements pour les mouvements de glissement, disons à 40 ms ou 50 ms. (cela dépend du processeur).

Tous les événements tactiles se présentent comme suit: ACTION_DOWN -> ACTION_MOVE ...... ACTION_MOVE -> ACTION_UP. Nous devons donc garder les mouvements DOWN et UP et filtrer le taux de MOVE (ce sont les méchants).

Et voici un moyen de le faire (vous pouvez ajouter plus de types d'événements comme le toucher à 2 doigts, tout ce qui m'intéresse ici est le défilement à un seul doigt).

import android.content.Context;
import android.view.MotionEvent;
import android.webkit.WebView;


public class MyWebView extends WebView{

    public MyWebView(Context context) {
        super(context);
        // TODO Auto-generated constructor stub
    }

    private long lastMoveEventTime = -1;
    private int eventTimeInterval = 40;

    @Override
    public boolean onTouchEvent(MotionEvent ev) {

        long eventTime = ev.getEventTime();
        int action = ev.getAction();

        switch (action){
            case MotionEvent.ACTION_MOVE: {
                if ((eventTime - lastMoveEventTime) > eventTimeInterval){
                    lastMoveEventTime = eventTime;
                    return super.onTouchEvent(ev);
                }
                break;
            }
            case MotionEvent.ACTION_DOWN:
            case MotionEvent.ACTION_UP: {
                return super.onTouchEvent(ev);
            }
        }
        return true;
    }
}

Bien sûr, utilisez cette classe au lieu de WebView et vous verrez la différence lors du défilement.

Il ne s'agit que d'une approche à une solution, mais qui n'est pas encore entièrement mise en œuvre pour tous les cas de retard en raison du toucher de l'écran lors de l'utilisation de WebView. Cependant, c'est la meilleure solution que j'ai trouvée, au moins pour mes besoins spécifiques.

J'ai essayé toutes les propositions pour résoudre le problème de performances de rendu dans mon application phonegap. Mais rien n'a vraiment fonctionné.

Finalement, après une journée entière de recherche, je l'ai fait. J'ai défini dans la balise (pas la balise) de mon AndroidManifest

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

Maintenant, l'application se comporte de la même manière rapide que mon navigateur Web. On dirait que si l'accélération matérielle n'est pas toujours la meilleure fonctionnalité ...

Le problème détaillé que j'ai eu: https://stackoverflow.com/a/24467920/3595386

Aucune de ces réponses ne m'a été utile.

Enfin, j'ai trouvé la raison et la solution. La raison en était beaucoup de filtres CSS3 (filtre, -webkit-filter).

Solution

J'ai ajouté la détection de WebView dans le script de page Web afin d'ajouter la classe "lowquality" au corps HTML. BTW. Vous pouvez facilement suivre WebView en définissant l'agent utilisateur dans les paramètres WebView. Ensuite, j'ai créé une nouvelle règle CSS

body.lowquality * { filter: none !important; }

S'il n'y a que quelques composants de votre vue Web qui sont lents ou lents, essayez d'ajouter ceci aux éléments css:

transform: translate3d(0,0,0);
-webkit-transform: translate3d(0,0,0);

C'est le seul speedhack qui a vraiment eu un effet sur ma vue Web. Mais attention à ne pas en abuser! (vous pouvez en savoir plus sur le piratage dans cet article .)

Essaye ça:

mWebView.setLayerType(View.LAYER_TYPE_HARDWARE, null);

Si vous vous engagez à l' onclickévénement, il peut être lent sur les écrans tactiles.

Pour le rendre plus rapide, j'utilise fastclick , qui utilise les événements tactiles beaucoup plus rapides pour imiter l'événement de clic.