Sharing state across interactive render mode boundaries

Navigating state management in Blazor apps becomes complicated when you switch from running solely in one render mode to mixing render modes, or using InteractiveAuto mode. The challenge arises from the recreation of a scoped state with every render mode change, due to the lack of automatic state sharing between server and client environments. You can tackle this fragmentation by designating a single, consistent source for state persistence. In this recipe, we will dive into a strategy where the client is the source of truth, and we will restore state from the browser storage.

Let’s implement a generic component base that allows us to share state across interactive render mode boundaries.

Getting ready

Before you dive into state sharing, do the following:

• Create a Chapter05/Recipe07 directory – this will be your working directory
• Copy the BrowserStorage and StorageValue objects from the Resolving...