WebAssembly: Client-side Processing (Chapter 1, Recipe 4)
All processing happens locally in your browser after initial WebAssembly download
Detecting rendermode at runtime
⬇️ Downloading WebAssembly runtime and components...
🔄 Hydrating client-side components...
🔍 Current Render Mode Status
Previous state:
Current State: Static
Interactive: False
Assigned Mode: InteractiveWebAssemblyRenderMode
Hydration Time: Still hydrating
Current Action: Downloading and hydrating WebAssembly
Network Status: Downloading
💡 Component Lifecycle Insight
Important: Each render mode transition creates a fresh component instance. In-memory state (like action history) doesn't survive transitions without persistence mechanisms.
This behavior is normal Blazor architecture - what you see as "one page" is actually multiple component instances across render phases.
Current Session Actions:
- 14:16:41.995 1ms Component initialization started
- 14:16:41.995 1ms Initial render mode: Static
- 14:16:41.995 1ms RecipeUrlService initialized
- 14:16:41.995 1ms Educational delay: 1ms to observe static phase
All components are placed in the Client project.
Offer page sends parameters and code to Ticket component
- Before the tickets -
Ticket
Ticket component uses parameters it gets from Offer component page.
It has a button that calls the OnAdded event.
Ticket
Ticket component uses parameters it gets from Offer component page.
It has a button that calls the OnAdded event.
- After the tickets -
Features
- Render Mode Detection: Detects and displays current render mode at runtime
- Component Communication: Offer page sends parameters and event handlers to Ticket components
- WebAssembly Rendering: Uses InteractiveWebAssembly mode (renders in browser after download)
- Client-side Processing: No server round-trips after initial WebAssembly load
- Action History: Tracks component lifecycle events with categorized timeline
- Performance Benefits: Zero server latency for user interactions after hydration
- Educational Insights: Shows authentic component state and lifecycle behavior
- Interactive Demo: Dedicated demo page for hands-on WebAssembly exploration