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.

Hosting a Blazor app? Our Blazor hosting plans support Blazor Server, WebAssembly, and ASP.NET Core Hosted apps with all .NET render modes, on dedicated IIS application pools and Windows Server 2022. Compare plans.

Was this answer helpful?

« Back