Optimizing a Blazor WebAssembly application size

The size of a Blazor WebAssembly application directly affects loading time. Like any website, all resources must be downloaded before the user can interact with the application. Reducing the download size not only speeds up load times but also lowers data transfer costs on the server.

#Removing unused code using the Linker

The .NET framework includes a large number of types and methods, which is great for development but results in larger DLLs. Linking a Blazor WebAssembly application reduces its size by stripping unused code from the application's binaries.

By default, the linker is enabled when building in Release configuration:

dotnet publish --configuration Release

The following chart shows the _framework folder size for each compression algorithm, with and without the linker. Results will vary depending on which features your application uses, so treat these figures as a general indication of the linker's impact:

#Pre-compressing static files

A Blazor WebAssembly application consists of many DLL, JS, JSON, and binary files. Compressing them with Brotli or gzip can reduce the application size by about 60%. Rather than compressing files on demand, you can pre-compress them at build time with maximum compression settings. This takes longer to compile, but since it happens at build time, it has no impact on runtime performance. The following chart shows the size of the _framework folder of the default Blazor template for each compression algorithm:

By default, the Blazor tooling compresses files during compilation in Release configuration:

dotnet publish --configuration Release

You can see that the output contains 3 versions of each file:

Then, you can check in your browser that the files are served using Brotli or gzip:

#Removing time zone support

Blazor WebAssembly supports time zones by including a data file with information for all time zones. When converting time between time zones, it reads this file to retrieve the necessary data before computing the correct time. You can check the size of this file at _framework/wasm/dotnet.timezones.dat.

If your app does not require this feature, you can disable it by setting the BlazorEnableTimeZoneSupport property in the project file to false:

<PropertyGroup>
  <BlazorEnableTimeZoneSupport>false</BlazorEnableTimeZoneSupport>
</PropertyGroup>

After setting this property to false, the files will no longer be generated in the output folder when publishing, saving a few kB.

#Removing collation data

Collation data is included to make APIs such as StringComparison.InvariantCultureIgnoreCase work correctly. If you are certain your app does not need it, you can disable it by setting the BlazorWebAssemblyPreserveCollationData property in the project file to false:

<PropertyGroup>
  <BlazorWebAssemblyPreserveCollationData>false</BlazorWebAssemblyPreserveCollationData>
</PropertyGroup>

This property instructs the linker to remove collation data, resulting in a lighter mscorlib.dll. In the default application, the Brotli-compressed file is 115 kB smaller.

#Additional resources

• ASP.NET Core Blazor performance best practices

Do you have a question or a suggestion about this post? Contact me!