ASP.NET alat build Core Blazor WebAssembly dan kompilasi ahead-of-time (AOT)

Artikel ini menjelaskan alat build untuk aplikasi mandiri Blazor WebAssembly dan cara mengkompilasi aplikasi sebelum penyebaran dengan kompilasi ahead-of-time (AOT).

Meskipun artikel ini terutama berfokus pada aplikasi mandiriBlazor WebAssembly, bagian tentang ukuran timbunan untuk beberapa browser perangkat seluler juga berlaku untuk proyek sisi klien (.Client) Aplikasi Blazor Web.

Alat build .NET WebAssembly

Alat build .NET WebAssembly didasarkan pada Emscripten, toolchain pengkompilasi untuk platform web. Untuk menginstal alat build, gunakan salah satu pendekatan berikut:

• Untuk beban kerja pengembangan ASP.NET dan web di alat penginstal Visual Studio, pilih opsi alat build .NET WebAssembly dari daftar komponen opsional.
• Jalankan dotnet workload install wasm-tools dalam shell perintah administratif.

Catatan

Alat build .NET WebAssembly untuk proyek .NET 6

Beban wasm-tools kerja menginstal alat build untuk rilis terbaru. Namun, versi alat build saat ini tidak kompatibel dengan proyek yang ada yang dibangun dengan .NET 6. Proyek yang menggunakan alat build yang harus mendukung .NET 6 dan rilis yang lebih baru harus menggunakan multi-penargetan.

wasm-tools-net6 Gunakan beban kerja untuk proyek .NET 6 saat mengembangkan aplikasi dengan .NET 7 SDK. Untuk menginstal wasm-tools-net6 beban kerja, jalankan perintah berikut dari shell perintah administratif:

dotnet workload install wasm-tools-net6

Kompilasi ahead-of-time (AOT)

Blazor WebAssembly mendukung kompilasi ahead-of-time (AOT), di mana Anda dapat mengkompilasi kode .NET langsung ke WebAssembly. Kompilasi AOT menghasilkan peningkatan performa runtime dengan mengorbankan ukuran aplikasi yang lebih besar.

Tanpa mengaktifkan kompilasi AOT, Blazor WebAssembly aplikasi berjalan di browser menggunakan penerjemah .NET Intermediate Language (IL) yang diterapkan di WebAssembly dengan dukungan runtime just-in-time (JIT) parsial, secara informal disebut sebagai Jiterpreter. Karena kode .NET IL ditafsirkan, aplikasi biasanya berjalan lebih lambat daripada yang mereka lakukan pada runtime JIT .NET sisi server tanpa interpretasi IL. Kompilasi AOT mengatasi masalah performa ini dengan mengkompilasi kode .NET aplikasi langsung ke WebAssembly untuk eksekusi WebAssembly asli oleh browser. Peningkatan performa AOT dapat menghasilkan peningkatan dramatis untuk aplikasi yang menjalankan tugas intensif CPU. Kelemahan untuk menggunakan kompilasi AOT adalah bahwa aplikasi yang dikompilasi AOT umumnya lebih besar dari rekan-rekan yang ditafsirkan IL mereka, sehingga mereka biasanya membutuhkan waktu lebih lama untuk diunduh ke klien ketika pertama kali diminta.

Untuk panduan tentang menginstal alat build .NET WebAssembly, lihat ASP.NET alat build Core Blazor WebAssembly dan kompilasi ahead-of-time (AOT).

Untuk mengaktifkan kompilasi AOT WebAssembly, tambahkan properti yang <RunAOTCompilation> diatur ke true file Blazor WebAssembly proyek aplikasi:

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

Untuk mengkompilasi aplikasi ke WebAssembly, terbitkan aplikasi. Menerbitkan Release konfigurasi memastikan penautan .NET Intermediate Language (IL) juga dijalankan untuk mengurangi ukuran aplikasi yang diterbitkan:

dotnet publish -c Release

Kompilasi AOT WebAssembly hanya dilakukan saat proyek diterbitkan. Kompilasi AOT tidak digunakan ketika proyek dijalankan selama pengembangan (Development lingkungan) karena kompilasi AOT biasanya memakan waktu beberapa menit pada proyek kecil dan berpotensi jauh lebih lama untuk proyek yang lebih besar. Mengurangi waktu build untuk kompilasi AOT sedang dikembangkan untuk rilis ASP.NET Core di masa mendatang.

Ukuran aplikasi yang dikompilasi Blazor WebAssembly AOT umumnya lebih besar dari ukuran aplikasi jika dikompilasi ke dalam .NET IL:

• Meskipun perbedaan ukuran tergantung pada aplikasi, sebagian besar aplikasi yang dikompilasi AOT sekitar dua kali ukuran versi yang dikompilasi IL mereka. Ini berarti bahwa menggunakan kompilasi AOT memperdagangkan performa waktu pemuatan untuk performa runtime. Apakah tradeoff ini layak menggunakan kompilasi AOT tergantung pada aplikasi Anda. Blazor WebAssembly aplikasi yang intensif CPU umumnya mendapat manfaat paling besar dari kompilasi AOT.

• Ukuran aplikasi yang dikompilasi AOT yang lebih besar disebabkan oleh dua kondisi:

  • Kode lainnya diperlukan untuk mewakili instruksi .NET IL tingkat tinggi di WebAssembly asli.
  • AOT tidak memangkas DLL terkelola saat aplikasi diterbitkan. Blazor memerlukan DLL untuk metadata refleksi dan untuk mendukung fitur runtime .NET tertentu. Membutuhkan DLL pada klien meningkatkan ukuran unduhan tetapi memberikan pengalaman .NET yang lebih kompatibel.

Catatan

Untuk properti dan target MSBuild Mono/WebAssembly, lihat WasmApp.Common.targets (dotnet/runtime repositori GitHub). Dokumentasi resmi untuk properti MSBuild umum direncanakan per opsi konfigurasi msbuild blazor dokumen (dotnet/docs #27395).

Memangkas .NET IL setelah kompilasi ahead-of-time (AOT)

Opsi WasmStripILAfterAOT MSBuild memungkinkan penghapusan .NET Intermediate Language (IL) untuk metode yang dikompilasi setelah melakukan kompilasi AOT ke WebAssembly, yang mengurangi ukuran _framework folder.

Dalam file proyek aplikasi:

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

Pengaturan ini memangkas kode IL untuk sebagian besar metode yang dikompilasi, termasuk metode dari pustaka dan metode di aplikasi. Tidak semua metode yang dikompilasi dapat dipangkas, karena beberapa masih diperlukan oleh penerjemah .NET saat runtime.

Untuk melaporkan masalah dengan opsi pemangkasan, buka masalah pada dotnet/runtime repositori GitHub.

Nonaktifkan properti pemangkasan jika mencegah aplikasi Anda berjalan normal:

<WasmStripILAfterAOT>false</WasmStripILAfterAOT>

Ukuran timbunan untuk beberapa browser perangkat seluler

Saat membuat Blazor aplikasi yang berjalan pada klien dan menargetkan browser perangkat seluler, terutama Safari di iOS, mengurangi memori maksimum untuk aplikasi dengan properti EmccMaximumHeapSize MSBuild mungkin diperlukan. Untuk informasi selengkapnya, lihat Host dan sebarkan ASP.NET Core Blazor WebAssembly.

Runtime relinking

Salah satu bagian terbesar aplikasi Blazor WebAssembly adalah runtime .NET berbasis WebAssembly (dotnet.wasm) yang harus diunduh browser saat aplikasi pertama kali diakses oleh browser pengguna. Menautkan ulang runtime .NET WebAssembly memangkas kode runtime yang tidak digunakan dan dengan demikian meningkatkan kecepatan unduhan.

Runtime relinking memerlukan penginstalan alat build .NET WebAssembly. Untuk informasi selengkapnya, lihat Alat untuk ASP.NET Core Blazor.

Dengan alat build .NET WebAssembly terinstal, runtime relinking dilakukan secara otomatis saat aplikasi diterbitkan dalam Release konfigurasi. Pengurangan ukuran sangat dramatis ketika menonaktifkan globalisasi. Untuk informasi selengkapnya, lihat globalisasi dan pelokalan inti Blazor ASP.NET.

Penting

Runtime yang menautkan ulang instans kelas javaScript-invokable .NET methods kecuali jika dilindungi. Untuk informasi selengkapnya, lihat Memanggil metode .NET dari fungsi JavaScript di ASP.NET Core Blazor.

Instruksi Tunggal, Beberapa Data (SIMD)

Instruksi Tunggal WebAssembly, Multiple Data (SIMD) dapat meningkatkan throughput komputasi vektorisasi dengan melakukan operasi pada beberapa bagian data secara paralel menggunakan satu instruksi. SIMD diaktifkan secara default.

Untuk menonaktifkan SIMD, misalnya saat menargetkan browser atau browser lama di perangkat seluler yang tidak mendukung SIMD, atur <WasmEnableSIMD> properti ke false dalam file proyek aplikasi (.csproj):

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

Untuk informasi selengkapnya, lihat Mengonfigurasi dan menghosting aplikasi .NET WebAssembly: SIMD - Instruksi tunggal, beberapa data , dan perhatikan bahwa panduan tidak diberi versi dan berlaku untuk rilis publik terbaru.

Penanganan pengecualian

Penanganan pengecualian diaktifkan secara default. Untuk menonaktifkan penanganan pengecualian, tambahkan <WasmEnableExceptionHandling> properti dengan nilai false dalam file proyek aplikasi (.csproj):

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

Sumber Daya Tambahan:

• ASP.NET Dependensi asli Core Blazor WebAssembly
• Format kemasan webcil untuk rakitan .NET