Blazor Expert - Orchestration Hub

Expert-level guidance for developing applications with Blazor, Microsoft's framework for building interactive web UIs using C# instead of JavaScript.

Quick Reference: When to Load Which Resource

Orchestration Protocol

Phase 1: Task Analysis

Identify your primary objective:

• UI Building → Load components-lifecycle.md
• State Handling → Load state-management-events.md
• Navigation → Load routing-navigation.md
• Data Input → Load forms-validation.md
• User Access → Load authentication-authorization.md
• Speed/Efficiency → Load performance-advanced.md

Phase 2: Resource Loading

Open the recommended resource file(s) and search for your specific need using Ctrl+F. Each resource is organized by topic with working code examples.

Phase 3: Implementation & Validation

• Follow code patterns from the resource
• Adapt to your specific requirements
• Test in appropriate hosting model (Server/WASM/Hybrid)
• Review troubleshooting section if issues arise

Blazor Hosting Models Overview

Blazor Server

• How: Runs on server via SignalR
• Best For: Line-of-business apps, need full .NET runtime, small download size
• Trade-offs: High latency, requires connection, server resource intensive

Blazor WebAssembly

• How: Runs in browser via WebAssembly
• Best For: PWAs, offline apps, no server dependency, client-heavy applications
• Trade-offs: Large initial download, limited .NET APIs, slower cold start

Blazor Hybrid

• How: Runs in MAUI/WPF/WinForms with Blazor UI
• Best For: Cross-platform desktop/mobile apps
• Trade-offs: Platform-specific considerations, additional dependencies

Decision: Choose based on deployment environment, offline requirements, and server constraints.

Common Implementation Workflows

Scenario 1: Build a Data-Entry Component

1. Read components-lifecycle.md - Component structure section
2. Read state-management-events.md - EventCallback pattern
3. Read forms-validation.md - EditForm component
4. Combine: Create component with parameters → capture user input → validate → notify parent

Scenario 2: Implement User Authentication & Protected Pages

1. Read authentication-authorization.md - Setup section
2. Read routing-navigation.md - Layouts section
3. Read authentication-authorization.md - AuthorizeView section
4. Combine: Configure auth → create login page → protect routes → check auth in components

Scenario 3: Build Interactive List with Search/Filter

1. Read routing-navigation.md - Query strings section
2. Read state-management-events.md - Data binding section
3. Read performance-advanced.md - Virtualization section
4. Combine: Capture search input → update URL query → fetch filtered data → virtualize if large

Scenario 4: Optimize Performance of Existing App

1. Read performance-advanced.md - All sections
2. Identify bottlenecks:
   • Unnecessary renders? → ShouldRender override, @key directive
   • Large lists? → Virtualization
   • JS latency? → Module isolation pattern
3. Apply targeted optimizations from resource

Key Blazor Concepts

Component Architecture

• Components: Self-contained UI units with optional logic
• Parameters: Inputs to components, enable reusability
• Cascading Values: Share state with descendants without explicit

...