Outils de génération ASP.NET Core Blazor WebAssembly et compilation AOT (ahead-of-time)

Remarque

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

Important

Ces informations portent sur la préversion du produit, qui est susceptible d’être en grande partie modifié avant sa commercialisation. Microsoft n’offre aucune garantie, expresse ou implicite, concernant les informations fournies ici.

Pour la version actuelle, consultez la version .NET 8 de cet article.

Cet article décrit les outils de génération pour les applications Blazor WebAssembly autonomes et la façon de compiler une application avant le déploiement avec la compilation AOT (ahead-of-time).

Bien que l’article se concentre principalement sur les applications Blazor WebAssembly autonomes, la section sur la taille du tas pour certains navigateurs d’appareils mobiles s’applique également au projet côté client (.Client) d’une application web Blazor.

.NET WebAssembly Build Tools

Les outils de génération .NET WebAssembly sont basés sur Emscripten, une chaîne d’outils de compilateur pour la plateforme web. Pour installer les outils de génération, utilisez l’une des approches suivantes :

  • Pour la charge de travail ASP.NET et développement web dans le programme d’installation de Visual Studio, sélectionnez l’option Outils de génération WebAssembly .NET dans la liste des composants facultatifs.
  • Exécutez dotnet workload install wasm-tools dans un interpréteur de commandes d’administration.

Note

Outils de génération .NET WebAssembly pour les projets .NET 6

La charge de travail wasm-tools installe les outils de génération pour la version la plus récente. Toutefois, la version actuelle des outils de génération est incompatible avec les projets existants créés avec .NET 6. Les projets utilisant les outils de génération qui doivent prendre en charge .NET 6, ou une version postérieure, doivent utiliser le multi-ciblage.

Utilisez la charge de travail wasm-tools-net6 pour les projets .NET 6 lors du développement d’applications avec le SDK .NET 7. Pour installer la charge de travail wasm-tools-net6, exécutez la commande suivante à partir d’un interpréteur de commandes d’administration :

dotnet workload install wasm-tools-net6

Compilation anticipée (AOT)

Blazor WebAssembly prend en charge la compilation à l’avance (AOT), où vous pouvez compiler votre code .NET directement en WebAssembly. La compilation AOT permet d’améliorer les performances du runtime au détriment d’une plus grande taille d’application.

Sans activation de la compilation AOT, les applications Blazor WebAssembly s’exécutent sur le navigateur en utilisant un interpréteur de langage intermédiaire (IL) .NET implémenté en WebAssembly avec une prise en charge partielle du runtime juste-à-temps (JIT), qui est appelé de façon informelle Jiterpreter. Étant donné que le code IL .NET est interprété, les applications s’exécutent généralement plus lentement qu’elles le feraient sur un runtime juste-à-temps .NET côté serveur sans interprétation d’IL. La compilation AOT résout ce problème de performances en compilant le code .NET d’une application directement en WebAssembly pour l’exécution native de WebAssembly par le navigateur. L’amélioration des performances avec la compilation AOT peut apporter des améliorations spectaculaires pour les applications qui exécutent des tâches sollicitant beaucoup l’UC. L’inconvénient de l’utilisation de la compilation AOT est que les applications avec compilation AOT sont généralement plus volumineuses que leurs équivalents interprétés par le langage intermédiaire, de sorte qu’elles prennent généralement plus de temps à se télécharger sur le client lors de la première requête.

Sans activer la compilation AOT, les applications Blazor WebAssembly s’exécutent sur le navigateur à l’aide d’un interpréteur de langage intermédiaire (IL) .NET implémenté en WebAssembly. Étant donné que le code .NET est interprété, les applications s’exécutent généralement plus lentement qu’elles le feraient sur un runtime juste-à-temps (JIT) .NET côté serveur. La compilation AOT résout ce problème de performances en compilant le code .NET d’une application directement en WebAssembly pour l’exécution native de WebAssembly par le navigateur. L’amélioration des performances avec la compilation AOT peut apporter des améliorations spectaculaires pour les applications qui exécutent des tâches sollicitant beaucoup l’UC. L’inconvénient de l’utilisation de la compilation AOT est que les applications avec compilation AOT sont généralement plus volumineuses que leurs équivalents interprétés par le langage intermédiaire, de sorte qu’elles prennent généralement plus de temps à se télécharger sur le client lors de la première requête.

Pour obtenir des instructions d’installation des outils de génération .NET WebAssembly, consultez Outils de génération ASP.NET Core Blazor WebAssembly et compilation AOT (ahead-of-time).

Pour activer la compilation AOT en WebAssembly, ajoutez la propriété <RunAOTCompilation> définie sur true au fichier projet de l’application Blazor WebAssembly :

<PropertyGroup>
  <RunAOTCompilation>true</RunAOTCompilation>
</PropertyGroup>

Pour compiler l’application en WebAssembly, publiez l’application. La publication de la configuration Release garantit que la liaison en langage intermédiaire (IL) .NET est également exécutée pour réduire la taille de l’application publiée :

dotnet publish -c Release

La compilation AOT en WebAssembly n’est effectuée que lorsque le projet est publié. La compilation AOT n’est pas utilisée lorsque le projet est exécuté pendant le développement (environnement Development), car la compilation AOT prend généralement plusieurs minutes sur de petits projets, et peut être beaucoup plus longue pour les projets plus volumineux. La réduction du temps de génération pour la compilation AOT est en cours de développement pour les versions futures d’ASP.NET Core.

La taille d’une application Blazor WebAssembly avec compilation AOT est généralement supérieure à la taille de l’application si elle est compilée en langage intermédiaire .NET :

  • Bien que la différence de taille dépende de l’application, la plupart des applications avec compilation AOT ont environ deux fois la taille de leurs versions compilées en langage intermédiaire. Cela signifie que l’utilisation de la compilation AOT représente un compromis entre les performances de temps de charge et les performances d’exécution. Votre application particulière détermine si ce compromis vaut la peine d’utiliser la compilation AOT. Les applications Blazor WebAssembly gourmandes en processeur bénéficient généralement le plus de la compilation AOT.

  • La plus grande taille d’une application compilée par AOT est due à deux conditions :

    • Plus de code est nécessaire pour représenter les instructions en langage intermédiaire .NET de haut niveau en WebAssembly natif.
    • AOT ne supprime pas les DLL managées lors de la publication de l’application. Blazor nécessite les DLL pour les métadonnées de réflexion et pour prendre en charge certaines fonctionnalités de runtime .NET. L’utilisation des DLL sur le client augmente la taille du téléchargement, mais offre une expérience .NET plus compatible.

Remarque

Pour plus d’informations sur les propriétés et les cibles MSBuild Mono/WebAssembly, consultez WasmApp.Common.targets (dépôt GitHub dotnet/runtime). La documentation officielle pour les propriétés MSBuild courantes est planifiée selon la page Document blazor msbuild configuration options dotnet/docs#27395 (Documenter les options de configuration msbuild blazor).

Découper .NET IL après la compilation anticipée (AOT)

L’option WasmStripILAfterAOT MSBuild permet de supprimer le langage .NET Intermediate Language (IL) pour les méthodes compilées après avoir effectué une compilation AOT sur WebAssembly, ce qui réduit la taille du dossier _framework .

Dans le fichier projet de l’application :

<PropertyGroup>
  <RunAOTCompilation>true</RunAOTCompilation>
  <WasmStripILAfterAOT>true</WasmStripILAfterAOT>
</PropertyGroup>

Ce paramètre supprime le code IL pour la plupart des méthodes compilées, y compris les méthodes des bibliothèques et des méthodes dans l’application. Toutes les méthodes compilées ne peuvent pas être supprimées, car certaines sont toujours requises par l’interpréteur .NET au moment de l’exécution.

Pour signaler un problème avec l’option de découpage, soumettez un cas sur le dotnet/runtime référentiel GitHub.

Désactivez la propriété de découpage si elle empêche votre application de s’exécuter normalement :

<WasmStripILAfterAOT>false</WasmStripILAfterAOT>

Taille du tas pour certains navigateurs d’appareils mobiles

Lors de la création d’une application Blazor qui s’exécute sur le client et cible les navigateurs d’appareils mobiles, en particulier Safari sur iOS, il peut être nécessaire de diminuer la mémoire maximale pour l’application avec la propriété MSBuild EmccMaximumHeapSize. Pour plus d’informations, consultez Héberger et déployer ASP.NET Core Blazor WebAssembly.

Nouvelle liaison du runtime

L’une des plus grandes parties d’une application Blazor WebAssembly est le runtime .NET basé sur WebAssembly (dotnet.wasm) que le navigateur doit télécharger lors de la première requête sur l’application par le navigateur d’un utilisateur. La nouvelle liaison du runtime WebAssembly .NET réduit le code d’exécution inutilisé et améliore ainsi la vitesse de téléchargement.

La nouvelle liaison du runtime nécessite l’installation des outils de génération WebAssembly .NET. Pour plus d’informations, consultez Outils pour ASP.NET Core Blazor.

Une fois les outils de génération WebAssembly .NET installés, la nouvelle liaison du runtime est effectuée automatiquement lorsqu’une application est publiée dans la configuration Release. La réduction de taille est particulièrement spectaculaire lorsque l’on désactive la globalisation. Pour plus d’informations, consultez Globalisation et localisation d’ASP.NET Core Blazor.

Important

La nouvelle liaison du runtime supprime les méthodes .NET disponibles pour JavaScript de l’instance de classe, sauf si elles sont protégées. Pour plus d’informations, consultez Appeler des fonctions JavaScript à partir de méthodes .NET dans ASP.NET Core Blazor.

Instruction unique, plusieurs données (Single Instruction, Multiple Data/SIMD)

WebAssembly Single Instruction, Multiple Data (SIMD) peut améliorer le débit des calculs vectorisés en effectuant une opération sur plusieurs éléments de données en parallèle à l’aide d’une seule instruction. SIMD est activé par défaut.

Pour désactiver SIMD, par exemple lors du ciblage d’anciens navigateurs ou de navigateurs sur des appareils mobiles qui ne prennent pas en charge SIMD, définissez la propriété <WasmEnableSIMD> sur false dans le Fichier projet de l’application (.csproj) :

<PropertyGroup>
  <WasmEnableSIMD>false</WasmEnableSIMD>
</PropertyGroup>

Pour plus d’informations, consultez Configuration et hébergement d’applications .NET WebAssembly : SIMD – Instruction unique, plusieurs données et notez que l’aide n’est pas versionnée et s’applique à la dernière version publique.

WebAssembly Single Instruction, Multiple Data (SIMD) peut améliorer le débit des calculs vectorisés en effectuant une opération sur plusieurs éléments de données en parallèle à l’aide d’une seule instruction. SIMD est désactivé par défaut.

Pour activer SIMD, ajoutez la propriété <WasmEnableSIMD> définie sur true dans le fichier projet de l’application (.csproj) :

<PropertyGroup>
  <WasmEnableSIMD>true</WasmEnableSIMD>
</PropertyGroup>

Pour plus d’informations, consultez Configuration et hébergement d’applications .NET WebAssembly : SIMD – Instruction unique, plusieurs données et notez que l’aide n’est pas versionnée et s’applique à la dernière version publique.

Gestion des exceptions

La gestion des exceptions est activée par défaut. Pour désactiver la gestion des exceptions, ajoutez la propriété <WasmEnableExceptionHandling> avec une valeur de false dans le fichier projet de l’application (.csproj) :

<PropertyGroup>
  <WasmEnableExceptionHandling>false</WasmEnableExceptionHandling>
</PropertyGroup>

Pour activer la gestion des exceptions WebAssembly, ajoutez la propriété <WasmEnableExceptionHandling> avec une valeur de true dans le fichier projet de l’application (.csproj) :

<PropertyGroup>
  <WasmEnableExceptionHandling>true</WasmEnableExceptionHandling>
</PropertyGroup>

Ressources supplémentaires