Blazor Render Modes and Interactive Components (.NET 8+) Print

  • 0

Overview

Starting with .NET 8, Blazor introduced a unified component model with different render modes. Understanding these modes is essential for deploying Blazor apps to Plesk Windows hosting.

Available Render Modes

Static Server-Side Rendering (Static SSR)

Components render HTML on the server with no interactivity.

@rendermode Static

Use when: Content pages, SEO-critical pages, minimal interaction needed

Interactive Server

Components are interactive via SignalR connection to server.

@rendermode InteractiveServer

Use when: Full interactivity needed, data stays on server, real-time updates

Hosting requirement: Persistent server connection (SignalR)

Interactive WebAssembly

Components run entirely in browser via WebAssembly.

@rendermode InteractiveWebAssembly

Use when: Offline capability, reduce server load, client-side processing

Hosting requirement: Static file hosting only after initial load

Interactive Auto

Uses Server initially, then WebAssembly after download completes.

@rendermode InteractiveAuto

Use when: Best of both worlds - fast initial load, then client-side

Setting Global Render Mode

In App.razor:

<Routes @rendermode="InteractiveServer" />

Per-Component Render Mode

Apply to individual components:

@page "/counter"
@rendermode InteractiveServer

<h1>Counter</h1>
<button @onclick="IncrementCount">Click me</button>

Hosting Considerations for Plesk

Static SSR Only

  • Lowest server resources
  • Works like traditional MVC
  • No special configuration needed

Interactive Server

  • Requires WebSocket support (enabled by default)
  • Consumes server memory per connection
  • Consider Application Pool memory limits

Interactive WebAssembly

  • Larger initial download (~2-5MB framework)
  • Ensure MIME types configured for .wasm files
  • Consider enabling compression

Common Issues

"Cannot use rendermode on this component"

Ensure component hierarchy supports the render mode. Parent components may need matching modes.

Interactive components not working

Verify the @rendermode directive is applied. Default is static in .NET 8+.

SignalR disconnections with InteractiveServer

See our "Blazor SignalR Connection Troubleshooting" article.

Recommended Configuration for Production

// Program.cs
builder.Services.AddRazorComponents()
    .AddInteractiveServerComponents()
    .AddInteractiveWebAssemblyComponents();

This enables all render modes, giving you flexibility per-component.


Was this answer helpful?

« Back