Blazor (Server & WebAssembly)

// Program.cs for Blazor Server
builder.Services.AddRazorComponents().AddInteractiveServerComponents();

// Program.cs for Blazor WebAssembly (client project)
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");

Common follow-ups: What is Blazor United / Auto render mode and how does it combine both models?;What are the latency implications of Blazor Server's SignalR dependency?

// Customizing reconnection UI behavior in Blazor Server
<div id="components-reconnect-modal">
    Connection lost. Attempting to reconnect...
</div>

// Configuring reconnection retry intervals
builder.Services.Configure<CircuitOptions>(options => {
    options.DisconnectedCircuitMaxRetained = 100;
});

Common follow-ups: What is a 'circuit' in Blazor Server terminology?;How long does the server retain disconnected circuit state before discarding it?

// Server memory scales with concurrent circuits:
// 1000 concurrent Blazor Server users = 1000 active circuits
// each holding component state, consuming server RAM

builder.Services.Configure<CircuitOptions>(options => {
    options.DisconnectedCircuitRetentionPeriod = TimeSpan.FromMinutes(3);
});

Common follow-ups: How does this scaling concern compare to Blazor WebAssembly's client-side memory model?;What happens to server resources when a circuit is abandoned?

<h3>@Title</h3>
<button @onclick="IncrementCount">Count: @count</button>

@code {
    [Parameter] public string Title { get; set; } = "Counter";
    private int count = 0;
    private void IncrementCount() => count++;
}

Common follow-ups: How do [Parameter] properties enable passing data from parent to child components?;What does the generated BuildRenderTree method actually do?

<input @bind="searchTerm" @bind:event="oninput" />
<p>Searching for: @searchTerm</p>

@code {
    private string searchTerm = "";
}

<!-- Default @bind uses onchange (fires on blur); oninput fires on every keystroke -->

Common follow-ups: How does @bind-Value work for custom component parameters?;What's the performance cost of oninput binding on every keystroke in Blazor Server?

@code {
    [Parameter] public int UserId { get; set; }
    private User? user;

    protected override async Task OnParametersSetAsync() {
        user = await UserService.GetUserAsync(UserId);  // re-runs if UserId changes
    }
}

Common follow-ups: What's the full order of Blazor's lifecycle methods (SetParametersAsync, OnInitialized, OnAfterRender)?;When would you use OnAfterRenderAsync instead?

@page "/counter"
@rendermode InteractiveAuto

<button @onclick="IncrementCount">Count: @count</button>

@code {
    private int count = 0;
    private void IncrementCount() => count++;
}

Common follow-ups: How does Interactive Auto decide when to switch from Server to WebAssembly?;What are the constraints on mixing render modes within one component tree?

@inject IJSRuntime JS

<button @onclick="ShowAlert">Alert</button>

@code {
    private async Task ShowAlert() {
        await JS.InvokeVoidAsync("alert", "Hello from Blazor!");
    }
}

Common follow-ups: How does JS interop performance differ between Blazor Server (network round-trip) and WebAssembly (in-process)?;How do you call C# methods FROM JavaScript (the reverse direction)?

// Blazor Server: this call incurs a real network round-trip
await JS.InvokeVoidAsync("updateChart", chartData);  // browser <-> server over SignalR

// Blazor WebAssembly: same call, purely in-browser, no network latency
await JS.InvokeVoidAsync("updateChart", chartData);  // in-process WASM <-> JS marshal

Common follow-ups: How would you batch multiple JS interop calls to reduce round-trips?;What is JSImport/JSExport and how does it improve WebAssembly interop performance?

@inject IUserService UserService
@inject NavigationManager Navigation

@code {
    protected override async Task OnInitializedAsync() {
        var user = await UserService.GetCurrentUserAsync();
        if (user == null) Navigation.NavigateTo("/login");
    }
}

Common follow-ups: Why can't Blazor components use constructor injection like typical services?;How does service lifetime (scoped vs singleton) differ in meaning between Blazor Server and WebAssembly?