Skip to content

Commit 61616e3

Browse files
kb(common): WASM prerendering
1 parent 8073a47 commit 61616e3

File tree

1 file changed

+47
-0
lines changed

1 file changed

+47
-0
lines changed
Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
---
2+
title: WebAssembly Server PreRendering with Telerik components
3+
description: WebAssembly Server PreRendering with Telerik components - two things that you need to set up
4+
type: troubleshooting
5+
page_title: WebAssembly Server PreRendering with Telerik components
6+
slug: common-kb-wasm-prerendering
7+
position:
8+
tags:
9+
res_type: kb
10+
---
11+
12+
## Description
13+
14+
I want to use the web assembly server-side pre-rendering feature in .NET 5 - the `WebAssemblyPrerendered` mode.
15+
16+
````
17+
<component type="typeof(App)" render-mode="WebAssemblyPrerendered" />
18+
````
19+
20+
You can read more about it in the following resources:
21+
22+
* <a href="https://devblogs.microsoft.com/aspnet/asp-net-core-updates-in-net-5-release-candidate-1/#blazor-webassembly-prerendering" target="_blank">MS blog: ASP.NET Core updates in .NET 5 Release Candidate 1 - Blazor WebAssembly prerendering</a>
23+
24+
* <a href="https://jonhilton.net/blazor-wasm-prerendering" target="_blank">Jon Hilton - Prerendering your Blazor WASM application with .NET 5 (part 1)</a>
25+
26+
* <a href="https://jonhilton.net/blazor-wasm-prerendering-missing-http-client/" target="_blank">Jon Hilton - Prerendering your Blazor WASM application with .NET 5 (part 2 - solving the missing HttpClient problem)</a>
27+
28+
## Solution
29+
30+
You can see how to add Telerik assets, services and the root component in the [What You Need]({%slug getting-started/what-you-need%}) article. Make sure you are familiar with it before you continue reading. Both the client-side, and the server-side information is necessary.
31+
32+
There are a couple of things specific to the Telerik components that you need to do:
33+
34+
* Add the Telerik services and the `TelerikRootComponent` as usual in the WebAssembly project.
35+
36+
* Add the Telerik web assets to the index page (now the `_Host.cshtml` page in the `Server` project) as usual.
37+
38+
* Add a package reference to the `Telerik.UI.for.Blazor` package in the `Server` project as well.
39+
40+
* Add the Telerik services in the `Server` projet as well.
41+
42+
* Add other specific services to the `Server` project as well (such as localization services for the Telerik components, or other services for your app like data retrieval logic) and ensure they have an appropriate implementation that can work on the server.
43+
44+
The last three steps are required so the server can also work with the Telerik components and render them. This is similar to using a server-side Blazor application - the first render happens on the server, like with a server-side Blazor app.
45+
46+
47+

0 commit comments

Comments
 (0)