From aa02b854668896a756b19a10db98bfecdc4f5ece Mon Sep 17 00:00:00 2001 From: "github-actions[bot]" <41898282+github-actions[bot]@users.noreply.github.com> Date: Wed, 3 Jan 2024 17:23:56 +0200 Subject: [PATCH] docs(common): Revamp WASM lazy loading KB (#1831) Co-authored-by: Dimo Dimov <961014+dimodi@users.noreply.github.com> --- .../common-lazy-load-assemblies-wasm.md | 78 +++++++++++++++++-- 1 file changed, 73 insertions(+), 5 deletions(-) diff --git a/knowledge-base/common-lazy-load-assemblies-wasm.md b/knowledge-base/common-lazy-load-assemblies-wasm.md index 09ccbcb09..d73417495 100644 --- a/knowledge-base/common-lazy-load-assemblies-wasm.md +++ b/knowledge-base/common-lazy-load-assemblies-wasm.md @@ -4,17 +4,85 @@ description: How to use the lazy assembly loading feature of Blazor with the Tel type: how-to page_title: Telerik Blazor Components and WebAssembly Lazy Load of Assemblies slug: common-kb-lazy-load-assemblies-wasm -position: -tags: +position: +tags: +ticketid: 1628239, 1633572 res_type: kb --- +## Environment -## Description + + + + + + + + + + + +
UI for Blazor version2.19.0 and above
.NET version5 and above
-How to use the lazy assembly loading feature of Blazor with the Telerik components? +## Description +How to use the [lazy assembly loading feature of Blazor WebAssembly apps](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-lazy-load-assemblies) with the Telerik Blazor components? ## Solution -An example is available in the following project: [https://github.com/telerik/blazor-ui/tree/master/common/lazy-load-assemblies-wasm](https://github.com/telerik/blazor-ui/tree/master/common/lazy-load-assemblies-wasm). \ No newline at end of file +All general guidance from the [Microsoft documentation](https://learn.microsoft.com/en-us/aspnet/core/blazor/webassembly-lazy-load-assemblies) applies. The Telerik-related specifics are: + +* List the following assemblies in the "client" `.csproj` file to be lazy loaded. + + ```` + + + + + + + + + + + + + + + + + + + ```` + +* The assembly requirements depend on component usage, and not on feature usage. For example, both icon assemblies are always required, as our components render icons internally and must be aware of both types of icons. The assemblies, which are related to Excel export, are always required when using a Grid. `Telerik.Recurrence.dll` is required only when using the Scheduler. +* Move the `` to a layout that is used only on pages that have the Telerik assemblies loaded. +* Lazy loading of assemblies does not support dynamic service injection. As a result, remove the Telerik service registration (`builder.Services.AddTelerikBlazor();`) from `Program.cs`. If you are using [localization for the Telerik Blazor components]({%slug globalization-localization%}), define the the localization service for the Telerik components with the `Localizer` parameter of the ``. The key thing is to instantiate the localization service inline. It cannot be injected as a variable from the `@code { }` block, because that will throw runtime errors. + + ```` + @using LazyLoadTelerikComponents.Shared.Services + + + ... + + ```` + +Overall, the lazy loading of assemblies at the correct time is a responsibility of the application. If an assembly is not loaded when required, the app will throw `System.IO.FileNotFoundException: Could not load file or assembly ...`. The loading code is in the `OnNavigateAsync` event handler of the ``. You can also define an optional loading screen inside the `` with a `` tag. + +### .NET 8 Specifics + +The following tips apply to .NET 8 WebAssembly apps only: + +* Use `.wasm` instead of `.dll` in the `.csproj` file and the `OnNavigateAsync` event handler. +* [Register the lazy loader service manually](https://github.com/dotnet/aspnetcore/issues/51966) in the "server" `Program.cs`. Otherwise, you may get a `InvalidOperationException: Cannot provide a value for property 'AssemblyLoader' on type '...Routes'. There is no registered service of type 'Microsoft.AspNetCore.Components.WebAssembly.Services.LazyAssemblyLoader'.` + + ```` + using Microsoft.AspNetCore.Components.WebAssembly.Services; + + builder.Services.AddScoped(typeof(LazyAssemblyLoader)); + ```` + +## Example + +An sample project is available in GitHub: [Lazy load Telerik Blazor assemblies](https://github.com/telerik/blazor-ui/tree/master/common/lazy-load-assemblies-wasm).