Partager via


meilleures pratiques de performance pour ASP.NET Core Blazor

Remarque

Ceci n’est pas la dernière version de cet article. Pour la version actuelle, consultez la version .NET 10 de cet article.

Avertissement

Cette version d'ASP.NET Core n'est plus prise en charge. Pour plus d’informations, consultez la stratégie de support .NET et .NET Core. Pour la version actuelle, consultez la version .NET 10 de cet article.

Blazor est optimisé pour des performances élevées dans les scénarios d’interface utilisateur d’application les plus réalistes. Toutefois, les meilleures performances dépendent des développeurs qui adoptent les modèles et fonctionnalités appropriés.

Remarque

Les exemples de code de ce nœud d’articles adoptent des types de référence nullables (NRT) et une analyse statique de l’état null du compilateur .NET, qui sont pris en charge dans ASP.NET Core dans .NET 6 ou version ultérieure.

Compilation anticipée (AOT)

La compilation anticipée (AOT) compile le code .NET d’une Blazor application directement dans le webAssembly natif pour une exécution directe par le navigateur. Les applications compilées par AOT entraînent des applications plus volumineuses qui prennent plus de temps à télécharger, mais les applications compilées par AOT fournissent généralement de meilleures performances d’exécution, en particulier pour les applications qui exécutent des tâches nécessitant beaucoup d’UC. Pour en savoir plus, veuillez consulter la section Outils de build ASP.NET Core Blazor WebAssembly et compilation ahead-of-time (AOT).

Métriques et suivi

Les fonctionnalités de suivi et de métriques vous aident à surveiller et diagnostiquer les performances des applications, à suivre les interactions utilisateur et à comprendre le comportement des composants dans les environnements de production.

Paramétrage

Pour activer Blazor les métriques et le suivi dans votre application, configurez OpenTelemetry avec les compteurs et les sources d’activité suivants dans le fichier de l’application Program où les services sont inscrits :

builder.Services.ConfigureOpenTelemetryMeterProvider(meterProvider =>
{
    meterProvider.AddMeter("Microsoft.AspNetCore.Components");
    meterProvider.AddMeter("Microsoft.AspNetCore.Components.Lifecycle");
    meterProvider.AddMeter("Microsoft.AspNetCore.Components.Server.Circuits");
});

builder.Services.ConfigureOpenTelemetryTracerProvider(tracerProvider =>
{
    tracerProvider.AddSource("Microsoft.AspNetCore.Components");
    tracerProvider.AddSource("Microsoft.AspNetCore.Components.Server.Circuits");
});

Compteurs de performances

Pour plus d’informations sur les compteurs de performances suivants, consultez ASP.NET métriques intégrées Core.

Compteur Microsoft.AspNetCore.Components :

  • aspnetcore.components.navigate: suit le nombre total de modifications de routage dans l’application.
  • aspnetcore.components.handle_event.duration: mesure la durée du traitement des événements de navigateur, y compris la logique métier.

Compteur Microsoft.AspNetCore.Components.Lifecycle :

  • aspnetcore.components.update_parameters.duration: mesure la durée des paramètres de composant de traitement, y compris la logique métier.
  • aspnetcore.components.render_diff.duration : suit la durée du rendu des lots.
  • aspnetcore.components.render_diff.size: effectue le suivi de la taille des lots de rendu.

Compteur Microsoft.AspNetCore.Components.Server.Circuits :

Dans les applications côté Blazor serveur, des métriques spécifiques au circuit supplémentaires sont les suivantes :

  • aspnetcore.components.circuit.active: affiche le nombre de circuits actifs actuellement en mémoire.
  • aspnetcore.components.circuit.connected: suit le nombre de circuits connectés aux clients.
  • aspnetcore.components.circuit.duration: mesure la durée de vie du circuit et fournit le nombre total de circuits.

Suivi Blazor

Pour plus d’informations sur les activités de suivi suivantes, consultez ASP.NET métriques intégrées Core.

Les nouvelles fonctionnalités de suivi d’activité utilisent la Microsoft.AspNetCore.Components source d’activité et fournissent trois principaux types d’activités de suivi : cycle de vie, navigation et gestion des événements.

Suivi du cycle de vie du circuit :

Microsoft.AspNetCore.Components.StartCircuit: Trace l’initialisation du circuit avec le format Circuit {circuitId}.

Étiquettes:

  • aspnetcore.components.circuit.id: identificateur de circuit unique.
  • error.type: Nom complet du type d’exception (facultatif)

Liens :

  • traçage d’HTTP
  • SignalR traçage

Utilisation : relie d’autres traces Blazor de la même session/du même circuit aux contextes HTTP et SignalR.

Suivi de navigation :

Microsoft.AspNetCore.Components.Navigate: effectue le suivi des modifications d’itinéraire avec le format Route {route} -> {componentType}.

Étiquettes:

  • aspnetcore.components.route: modèle de chemin d’accès d’URL de la page.
  • aspnetcore.components.type: nom de classe du Razor composant.
  • error.type: Nom complet du type d’exception (facultatif).

Liens :

  • traçage d’HTTP
  • SignalR traçage
  • Trace de circuit

Utilisation : Quelles Blazor pages cette session a visité ?

Suivi de gestion des événements :

Microsoft.AspNetCore.Components.HandleEvent: Trace la gestion des événements au format Event {attributeName} -> {componentType}.{methodName}.

Étiquettes:

  • aspnetcore.components.attribute.name: Nom de l’attribut HTML qui déclenche l’événement (exemple : onClick).
  • code.function.name: nom de méthode C# du gestionnaire.
  • aspnetcore.components.type: nom complet du composant C# cible qui reçoit l’événement.
  • error.type: Nom complet du type d’exception (facultatif).

Liens :

  • Trace de circuit
  • Trace de routage

Utilisations :

  • Cliquez sur quel composant a provoqué l’exception et sur quelle page ?
  • Dans quel circuit lié et avec quel contexte HTTP il s’est passé ?