Partager via

Optimisation des performances : disposition et conception

La conception de votre application WPF peut avoir un impact sur ses performances en créant une surcharge inutile dans le calcul de la disposition et la validation des références d’objet. La construction d’objets, en particulier au moment de l’exécution, peut affecter les caractéristiques de performances de votre application.

Cette rubrique fournit des recommandations en matière de performances dans ces domaines.

Mise en page

Le terme « étape de mise en page » décrit le processus de mesure et d’organisation des membres de la collection d’enfants d’un objet dérivé de Panel, avant de les dessiner à l’écran. L'étape de mise en page est un processus intensif en calculs mathématiques : plus il y a d'enfants dans la collection, plus le nombre de calculs nécessaires augmente. Par exemple, chaque fois qu’un objet enfant UIElement dans la collection change sa position, il peut déclencher une nouvelle passe par le système de disposition. En raison de la relation étroite entre les caractéristiques de l’objet et le comportement de disposition, il est important de comprendre le type d’événements qui peuvent appeler le système de disposition. Votre application fonctionnera mieux en réduisant autant que possible les appels inutiles de la passe de mise en page.

Le système de disposition effectue deux passes pour chaque élément enfant d'une collection : une passe de mesure et une passe d'arrangement. Chaque objet enfant fournit sa propre implémentation substituée des méthodes Measure et Arrange afin de définir son propre comportement de disposition spécifique. À son plus simple, la disposition est un système récursif qui conduit à un élément dimensionné, positionné et dessiné à l’écran.

  • Un objet enfant UIElement commence le processus de disposition en ayant d’abord ses propriétés principales mesurées.

  • Les propriétés de l’objet FrameworkElement liées à la taille, telles que Width, Heightet Margin, sont évaluées.

  • PanelUne logique spécifique est appliquée, telle que la Dock propriété du DockPanel, ou la Orientation propriété du StackPanel.

  • Le contenu est disposé ou positionné, une fois que tous les objets enfants ont été mesurés.

  • La collection d’objets enfant est affichée à l’écran.

Le processus de passage de mise en page est invoqué à nouveau si l’une des actions suivantes se produit :

  • Un objet enfant est ajouté à la collection.

  • A LayoutTransform est appliqué à l’objet enfant.

  • La méthode UpdateLayout est appelée pour l'objet enfant.

  • Lorsqu’une modification se produit sur la valeur d’une propriété de dépendance marquée par des métadonnées qui affectent les passes de mesure ou d'agencement.

Utiliser le panneau le plus efficace si possible

La complexité du processus de disposition est directement basée sur le comportement de disposition des Paneléléments dérivés que vous utilisez. Par exemple, un contrôle Grid ou StackPanel offre beaucoup plus de fonctionnalités qu’un contrôle Canvas. Le prix de cette augmentation accrue des fonctionnalités est une augmentation plus importante des coûts de performances. Toutefois, si vous n’avez pas besoin des fonctionnalités qu’un Grid contrôle fournit, vous devriez utiliser les alternatives moins coûteuses, telles qu’un Canvas ou un panneau personnalisé.

Pour plus d’informations, consultez La vue d’ensemble des panneaux.

Mettre à jour plutôt que remplacer un RenderTransform

Vous pouvez peut-être mettre à jour un Transform élément plutôt que de le remplacer comme valeur d’une RenderTransform propriété. Cela est particulièrement vrai dans les scénarios qui impliquent l’animation. En mettant à jour un élément existant Transform, vous évitez de lancer un calcul de disposition inutile.

Créer votre arborescence Top-Down

Lorsqu’un nœud est ajouté ou supprimé de l’arborescence logique, les invalidations de propriété sont levées sur le parent du nœud et tous ses enfants. Par conséquent, un modèle de construction top-down doit toujours être suivi pour éviter les coûts d’invalidations inutiles sur les nœuds qui ont déjà été validés. Le tableau suivant montre la différence de vitesse d'exécution entre la création d'une arborescence de haut en bas et de bas en haut, où l'arborescence est de 150 niveaux de profondeur avec un seul TextBlock et DockPanel à chaque niveau.

Action Génération d’arborescences (en ms) Rendu : inclut la construction d’arbres (en ms)
Bas en haut 366 454
Haut-bas 11 96

L’exemple de code suivant montre comment créer une arborescence vers le bas.

private void OnBuildTreeTopDown(object sender, RoutedEventArgs e)
{
    TextBlock textBlock = new TextBlock();
    textBlock.Text = "Default";

    DockPanel parentPanel = new DockPanel();
    DockPanel childPanel;

    myCanvas.Children.Add(parentPanel);
    myCanvas.Children.Add(textBlock);

    for (int i = 0; i < 150; i++)
    {
        textBlock = new TextBlock();
        textBlock.Text = "Default";
        parentPanel.Children.Add(textBlock);

        childPanel = new DockPanel();
        parentPanel.Children.Add(childPanel);
        parentPanel = childPanel;
    }
}

Private Sub OnBuildTreeTopDown(ByVal sender As Object, ByVal e As RoutedEventArgs)
    Dim textBlock As New TextBlock()
    textBlock.Text = "Default"

    Dim parentPanel As New DockPanel()
    Dim childPanel As DockPanel

    myCanvas.Children.Add(parentPanel)
    myCanvas.Children.Add(textBlock)

    For i As Integer = 0 To 149
        textBlock = New TextBlock()
        textBlock.Text = "Default"
        parentPanel.Children.Add(textBlock)

        childPanel = New DockPanel()
        parentPanel.Children.Add(childPanel)
        parentPanel = childPanel
    Next i
End Sub

Pour plus d’informations sur l’arborescence logique, consultez Arborescences dans WPF.

Voir aussi