Context
PWAs in Blazor WebAssembly run in the browser, but detecting and reacting to connectivity changes in a clean, reusable way is not trivial. The integration between the browser and Blazor for this use case requires JavaScript Interop, and documentation on the correct pattern is scarce.
The Challenge
Demonstrate how to monitor connectivity status in a Blazor PWA cleanly: listen to browser events from JavaScript, communicate them to .NET via Interop and distribute them to the components that need them without direct coupling.
The Solution
An open source reference example implementing a subscribable NetworkState container. JavaScript Interop captures the browser’s online/offline events and propagates them to the state container; any Blazor component can subscribe and react automatically without knowing anything about JS.
Technologies
- Blazor WebAssembly — frontend framework
- PWA — Progressive Web App
- JavaScript Interop — JS ↔ .NET communication
- C# — state logic