Partager via


Compression de la disposition

La compression de disposition supprime les dispositions spécifiées de l’arborescence visuelle dans une tentative d’amélioration des performances de rendu des pages. Cet article explique comment activer la compression de disposition et les avantages qu’il peut apporter.

Vue d’ensemble

Xamarin.Forms effectue la disposition à l’aide de deux séries d’appels de méthode récursive :

  • La disposition commence en haut de l’arborescence visuelle avec une page et passe par toutes les branches de l’arborescence visuelle pour englober chaque élément visuel d’une page. Les éléments parents d’autres éléments sont responsables du dimensionnement et du positionnement de leurs enfants par rapport à eux-mêmes.
  • L’invalidation est le processus par lequel une modification dans un élément d’une page déclenche un nouveau cycle de disposition. Les éléments sont considérés comme non valides lorsqu’ils n’ont plus la taille ou la position correctes. Chaque élément de l’arborescence visuelle contenant des enfants est alerté chaque fois qu’un de ses enfants change de taille. Par conséquent, une modification de la taille d’un élément dans l’arborescence visuelle peut provoquer des changements qui se propagent dans l’arbre.

Pour plus d’informations sur l’exécution Xamarin.Forms de la disposition, consultez Création d’une disposition personnalisée.

Le résultat du processus de disposition est une hiérarchie de contrôles natifs. Toutefois, cette hiérarchie inclut des convertisseurs de conteneurs et des wrappers supplémentaires pour les renderers de plateforme, en gonflant davantage l’imbrication de la hiérarchie d’affichage. Plus le niveau d’imbrication est profond, plus la quantité de travail doit Xamarin.Forms être effectuée pour afficher une page. Pour les dispositions complexes, la hiérarchie d’affichage peut être à la fois profonde et large, avec plusieurs niveaux d’imbrication.

Par exemple, considérez le bouton suivant à partir de l’exemple d’application pour la connexion à Facebook :

Bouton Facebook

Ce bouton est spécifié en tant que contrôle personnalisé avec la hiérarchie d’affichage XAML suivante :

<ContentView ...>
    <StackLayout>
        <StackLayout ...>
            <AbsoluteLayout ...>
                <Button ... />    
                <Image ... />
                <Image ... />
                <BoxView ... />
                <Label ... />
                <Button ... />
            </AbsoluteLayout>
        </StackLayout>
        <Label ... />
    </StackLayout>    
</ContentView>

La hiérarchie d’affichage imbriquée résultante peut être examinée avec l’arborescence visuelle dynamique. Sur Android, la hiérarchie de vues imbriquées contient 17 vues :

Afficher la hiérarchie pour le bouton Facebook

La compression de disposition, disponible pour Xamarin.Forms les applications sur les plateformes iOS et Android, vise à aplatir l’imbrication de la vue en supprimant les dispositions spécifiées de l’arborescence visuelle, ce qui peut améliorer les performances de rendu des pages. L’avantage de performances fourni varie en fonction de la complexité d’une page, de la version du système d’exploitation utilisée et de l’appareil sur lequel l’application s’exécute. Toutefois, les gains en termes de performances les plus importants seront visibles sur les appareils les plus anciens.

Remarque

Bien que cet article se concentre sur les résultats de l’application de la compression de disposition sur Android, il est tout aussi applicable à iOS.

Compression de la disposition

En XAML, la compression de disposition peut être activée en définissant la CompressedLayout.IsHeadless propriété true jointe sur une classe de disposition :

<StackLayout CompressedLayout.IsHeadless="true">
  ...
</StackLayout>   

Vous pouvez également l’activer en C# en spécifiant l’instance de disposition comme premier argument de la CompressedLayout.SetIsHeadless méthode :

CompressedLayout.SetIsHeadless(stackLayout, true);

Important

Étant donné que la compression de disposition supprime une disposition de l’arborescence visuelle, elle ne convient pas aux dispositions qui ont une apparence visuelle ou qui obtiennent une entrée tactile. Par conséquent, les dispositions qui définissent VisualElement des propriétés (telles que BackgroundColor, , IsVisibleRotation, Scale, TranslationX et TranslationY qui acceptent des mouvements) ne sont pas candidates à la compression de disposition. Toutefois, l’activation de la compression de disposition sur une disposition qui définit des propriétés d’apparence visuelle, ou qui accepte des mouvements, n’entraîne pas d’erreur de génération ou d’exécution. Au lieu de cela, la compression de disposition est appliquée et les propriétés d’apparence visuelle et la reconnaissance des mouvements échouent silencieusement.

Pour le bouton Facebook, la compression de disposition peut être activée sur les trois classes de disposition :

<StackLayout CompressedLayout.IsHeadless="true">
    <StackLayout CompressedLayout.IsHeadless="true" ...>
        <AbsoluteLayout CompressedLayout.IsHeadless="true" ...>
            ...
        </AbsoluteLayout>
    </StackLayout>
    ...
</StackLayout>  

Sur Android, cela entraîne une hiérarchie d’affichage imbriquée de 14 vues :

Afficher la hiérarchie pour le bouton Facebook avec compression de disposition

Par rapport à la hiérarchie d’affichages imbriquées d’origine de 17 vues, cela représente une réduction du nombre de vues de 17 %. Bien que cette réduction puisse apparaître insignifiante, la réduction de la vue sur une page entière peut être plus importante.

Renderers rapides

Les convertisseurs rapides réduisent l’inflation et les coûts de rendu des Xamarin.Forms contrôles sur Android en aplatissant la hiérarchie de vue native résultante. Cela améliore davantage les performances en créant moins d’objets, ce qui entraîne à son tour une arborescence visuelle moins complexe et moins d’utilisation de la mémoire. Pour plus d’informations sur les renderers rapides, consultez Renderers rapides.

Pour le bouton Facebook dans l’exemple d’application, la combinaison de la compression de disposition et des renderers rapides produit une hiérarchie d’affichage imbriquée de 8 vues :

Afficher la hiérarchie pour le bouton Facebook avec compression de disposition et convertisseurs rapides

Par rapport à la hiérarchie de vues imbriquées d’origine de 17 vues, cela représente une réduction de 52 %.

L’exemple d’application contient une page extraite d’une application réelle. Sans compression de disposition et convertisseurs rapides, la page produit une hiérarchie d’affichage imbriquée de 130 vues sur Android. L’activation de convertisseurs rapides et de compression de disposition sur les classes de disposition appropriées réduit la hiérarchie d’affichage imbriquée à 70 vues, soit une réduction de 46 %.

Résumé

La compression de disposition supprime les dispositions spécifiées de l’arborescence visuelle dans une tentative d’amélioration des performances de rendu des pages. Les avantages en matière de performances de cette technique varient selon la complexité d’une page, la version du système d’exploitation utilisé et l’appareil sur lequel l’application est en cours d’exécution. Toutefois, les gains en termes de performances les plus importants seront visibles sur les appareils les plus anciens.