What's the difference between
@(await Html.RenderComponentAsync<Todo>(RenderMode.ServerPrerendered))
and
@(await Html.RenderComponentAsync<Todo>(RenderMode.Server))
I was looking into the documentation but couldn't really find something that explains the difference. and also don't really understand the code comments over the enum stating:
// Summary:
// Renders a marker for a Blazor server-side application. This doesn't include any
// output from the component. When the user-agent starts, it uses this marker to
// bootstrap a blazor application.
Server = 2,
//
// Summary:
// Renders the component into static HTML and includes a marker for a Blazor server-side
// application. When the user-agent starts, it uses this marker to bootstrap a blazor
// application.
ServerPrerendered = 3
What is happening behind the scenes? And what are the Scenarios for using Server vs ServerPrerendered?
Blazor Server apps have direct access to server and network resources where the app is executing. Because Blazor WebAssembly and Blazor Hybrid apps execute on a client, they don't have direct access to server and network resources.
The rendering mode determines how the component gets rendered on the page. It configures whether the component is prerendered into the page or not and whether it simply renders static HTML on the page or if it includes the necessary information to bootstrap a Blazor application from the user agent.
Razor components can be integrated into Razor Pages and MVC apps in a hosted Blazor WebAssembly solution.
Blazor has two flavours, Blazor WebAssembly and Blazor Server. Both are used to create SPAs (which are a type of application) and both can be configured to use SSR (which is a technology).
Explained at ASP.NET Core and Blazor updates in .NET Core 3.0 Preview 9:
- Static Statically render the component with the specified parameters.
- Server Render a marker where the component should be rendered interactively by the Blazor Server app.
- ServerPrerendered Statically prerender the component along with a marker to indicate the component should later be rendered interactively by the Blazor Server app.
This concept is related to performance. The fastest way to serve a page is to render page statically then send, and, the slowest way to serve a page is to serve an "interactive Blazor" server page (with a live virtual DOM synchronized via SignalR websockets).
ServerPrerendered
is a trade-off: Blazor pre-renders page and sends it as a static page, then later the page becomes an interactive Blazor server app. This behavior is intended to serve pages quickly to search engines with time-based positioning.
The main problem with ServerPrerendered is that it loads twice ,so your data layer code is also executed twice. Server mode is just ok, may be a bit slower.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With