ASP.NET Core Blazor WebAssembly compilación y compilación anticipada (AOT)

En este artículo se describen las herramientas de compilación para aplicaciones Blazor WebAssembly independientes y cómo compilar una aplicación antes de la implementación con compilación anticipada (AOT).

Aunque el artículo se centra principalmente en aplicaciones Blazor WebAssembly independientes, la sección sobre el tamaño del montón para algunos exploradores de dispositivos móviles también se aplica al proyecto del lado cliente (.Client) de una aplicación web Blazor.

Herramientas de compilación de WebAssembly de .NET

Las herramientas de compilación de WebAssembly de .NET se basan en Emscripten, una cadena de herramientas del compilador para la plataforma web. Para instalar las herramientas de compilación, use cualquiera de los procedimientos siguientes:

• Para la carga de trabajo de ASP.NET y desarrollo web en el instalador de Visual Studio, seleccione la opción Herramientas de compilación de WebAssembly de .NET en la lista de componentes opcionales.
• Ejecute dotnet workload install wasm-tools en un shell de comandos administrativo.

Nota:

Herramientas de compilación de WebAssembly de .NET para proyectos de .NET 6

La carga de trabajo wasm-tools instala las herramientas de compilación para la versión más reciente. Sin embargo, la versión actual de las herramientas de compilación no es compatible con proyectos existentes compilados con .NET 6. Los proyectos que usen herramientas de compilación que deban admitir .NET 6 y una versión posterior deben ser compatibles con múltiples versiones (multi-targeting).

Use la carga de trabajo wasm-tools-net6 para proyectos de .NET 6 al desarrollar aplicaciones con el SDK de .NET 7. Para instalar la carga de trabajo wasm-tools-net6, ejecute el siguiente comando desde un shell de comandos administrativo:

dotnet workload install wasm-tools-net6

Compilación ahead-of-time (AOT)

Blazor WebAssembly admite la compilación Ahead Of Time(AOT), donde puede compilar el código de .NET directamente en WebAssembly. La compilación AOT da como resultado mejoras de rendimiento en tiempo de ejecución a costa de un tamaño de aplicación mayor.

Sin habilitar la compilación AOT, las aplicaciones Blazor WebAssembly se ejecutan en el explorador mediante un intérprete de lenguaje intermedio (IL) de .NET implementado en WebAssembly con compatibilidad parcial de runtime Just-In-Time (JIT), que informalmente se denomina el Jiterpreter. Dado que se interpreta el código IL de .NET, las aplicaciones normalmente se ejecutan más lentamente de lo que harían en un entorno de ejecución JIT de .NET del lado servidor sin ninguna interpretación de IL. La compilación AOT soluciona este problema de rendimiento mediante la compilación del código .NET de una aplicación directamente en WebAssembly para la ejecución nativa de WebAssembly con el explorador. La mejora del rendimiento de AOT puede producir mejoras drásticas para las aplicaciones que ejecutan tareas que consumen mucha CPU. El inconveniente de usar la compilación AOT es que las aplicaciones compiladas con AOT suelen ser mayores que sus equivalentes interpretadas con IL, por lo que normalmente tardan más tiempo en descargarse en el cliente cuando se solicitan por primera vez.

Para obtener instrucciones sobre cómo instalar las herramientas de compilación de WebAssembly de .NET, vea ASP.NET Core Blazor WebAssembly herramientas de compilación y compilación anticipada (AOT).

Para habilitar la compilación AOT de WebAssembly, agregue la propiedad <RunAOTCompilation> establecida en true al archivo de proyecto de la aplicación Blazor WebAssembly:

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

Para compilar la aplicación en WebAssembly, publique la aplicación. La publicación de la configuración Release garantiza que la vinculación del lenguaje intermedio (IL) de .NET también se ejecuta para reducir el tamaño de la aplicación publicada:

dotnet publish -c Release

La compilación AOT de WebAssembly solo se realiza cuando se publica el proyecto. La compilación AOT no se usa cuando el proyecto se ejecuta durante el desarrollo (entorno Development) porque la compilación AOT normalmente tarda varios minutos en proyectos pequeños y, potencialmente, mucho más tiempo en proyectos más grandes. La reducción del tiempo de compilación para la compilación AOT está en desarrollo para futuras versiones de ASP.NET Core.

El tamaño de una aplicación Blazor WebAssembly compilada con AOT suele ser mayor que si la aplicación se compilara en IL de .NET:

• Aunque la diferencia de tamaño depende de la aplicación, la mayoría de las aplicaciones compiladas con AOT son aproximadamente el doble del tamaño que sus versiones compiladas con IL. Esto significa que el uso de la compilación AOT da como resultado mejoras de rendimiento en tiempo de ejecución a costa del rendimiento del tiempo de carga. Dependerá de la aplicación si merece la pena usar la compilación AOT a pesar de esta contrapartida. Las aplicaciones Blazor WebAssembly que consumen mucha CPU suelen beneficiarse al máximo de la compilación AOT.

• El tamaño mayor de una aplicación compilada por AOT se debe a dos condiciones:

  • Se necesita más código para representar instrucciones generales de IL de .NET en WebAssembly nativo.
  • AOT no recorta los archivos DLL administrados cuando se publica la aplicación. Blazor necesita los archivos DLL para los metadatos de reflexión y para admitir determinadas características del entorno de ejecución de .NET. La necesidad de los archivos DLL en el cliente aumenta el tamaño de descarga, pero proporciona una experiencia de .NET más compatible.

Nota:

Para las propiedades y destinos de MSBuild de Mono/WebAssembly, consulte WasmApp.Common.targets (repositorio de GitHub dotnet/runtime). La documentación oficial de las propiedades comunes de MSBuild está planeada por opciones de configuración de MSBuild del documento Blazor (dotnet/docs #27395).

Recorte de IL de .NET después de la compilación Ahead Of Time (AOT)

La opción WasmStripILAfterAOT de MSBuild permite quitar el lenguaje intermedio (IL) de .NET para los métodos compilados después de realizar la compilación AOT en WebAssembly, lo que reduce el tamaño de la carpeta _framework.

En el archivo de proyecto de la aplicación:

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

Esta configuración recorta el código de IL para la mayoría de los métodos compilados, incluidos los métodos de bibliotecas y métodos de la aplicación. No todos los métodos compilados se pueden recortar, ya que el intérprete de .NET todavía requiere algunos en tiempo de ejecución.

Para notificar un problema con la opción de recorte, abra una incidencia en el dotnet/runtime repositorio de GitHub.

Deshabilite la propiedad trimming si impide que la aplicación se ejecute con normalidad:

<WasmStripILAfterAOT>false</WasmStripILAfterAOT>

Tamaño del montón para algunos exploradores de dispositivos móviles

Al compilar una aplicación Blazor que se ejecuta en el cliente y tiene como destino exploradores de dispositivos móviles, especialmente Safari en iOS, es posible que sea necesario reducir la memoria máxima de la aplicación con la propiedad MSBuild EmccMaximumHeapSize. Para obtener más información, vea Hospedaje e implementación de Blazor WebAssembly en ASP.NET Core.

Revinculación en tiempo de ejecución

Una de las partes más grandes de una aplicación Blazor WebAssembly es el entorno de ejecución de .NET basado en WebAssembly (dotnet.wasm) que el explorador debe descargar cuando el explorador de un usuario accede por primera vez a la aplicación. Al volver a vincular el entorno de ejecución de WebAssembly de .NET, se recorta el código en tiempo de ejecución sin usar y, por tanto, se mejora la velocidad de descarga.

La revinculación en tiempo de ejecución requiere la instalación de las herramientas de compilación de WebAssembly de .NET. Para más información, vea Herramientas para ASP.NET Core Blazor.

Con las herramientas de compilación de WebAssembly de .NET instaladas, la revinculación en tiempo de ejecución se realiza automáticamente cuando se publica una aplicación en la configuración de Release. La reducción del tamaño es especialmente considerable al deshabilitar la globalización. Para más información, vea Globalización y localización de Blazor de ASP.NET Core.

Importante

La revinculación en tiempo de ejecución recorta los métodos de .NET invocables de la instancia de clase JavaScript a menos que estén protegidos. Para obtener más información, vea Llamada a métodos de .NET desde funciones de JavaScript en ASP.NET Core Blazor.

Single Instruction, Multiple Data (SIMD)

Single Instruction, Multiple Data (SIMD) de WebAssembly puede mejorar el rendimiento de los cálculos vectorizados realizando una operación en varios fragmentos de datos en paralelo mediante una sola instrucción. SIMD está habilitado de manera predeterminada.

Para deshabilitar SIMD, por ejemplo, cuando se dirige a navegadores antiguos o navegadores en dispositivos móviles que no admiten SIMD, establezca la propiedad <WasmEnableSIMD> en false en el archivo de proyecto de la aplicación (.csproj):

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

Para obtener más información, consulte Configuración y alojamiento de aplicaciones .NET WebAssembly: SIMD: instrucción única, datos múltiples y tenga en cuenta que la guía no tiene versiones y se aplica a la última versión pública.

Control de excepciones

El control de excepciones está habilitado de manera predeterminada. Para deshabilitar el control de excepciones, agregue la propiedad <WasmEnableExceptionHandling> con un valor de false en el archivo de proyecto de la aplicación (.csproj):

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

Recursos adicionales

• Dependencias nativas de Blazor WebAssembly de ASP.NET Core
• Formato de empaquetado de Webcil para ensamblados .NET