Michael Bradvica joined Saxony Partners in 2020 as a Software Engineer on our app dev team. Previously, he has worked as a Full-Stack .NET Developer for technology services firms. You can read more of his thought leadership at MichaelBradvica.com – from which the blog post below has been adapted.

This blog post is third in a three-part series detailing the steps to achieve in-memory state in Blazor.

Blazor In-Memory State Management: A Step-by-Step Guide, Part 3

In the second entry of our Blazor in-memory series, we refactored our applications state into a single object located in our state store. This allowed us to reduce the number of events needed to publish from the store. Our subscribing components were then able to reduce the amount of boilerplate code required to subscribe and respond to events.

Our current implementation for subscribing events revolves around the common interface via the “ApplicationStateChanged” event. Each subscriber needs only to hold a reference to this event and re-render its content when the event is fired. This means that every subscribing component can now inherit from a base class that will implement the necessary logic.

Our base class for all subscribers:

“`csharp

public class BaseSubscriber : ComponentBase, IDisposable

{

    [CascadingParameter]

    public StateStore Store { get; set; }

    protected override void OnInitialized()

    {

        Store.ApplicationStateChangedHandler += ReRender;

        base.OnInitialized();

    }

    private void ReRender(object sender, ApplicationStateChanged e) => StateHasChanged();

    public void Dispose() => Store.ApplicationStateChangedHandler -= ReRender;

}

“`

Our BaseSubscriber will contain all the logic necessary for subscribing, un-subscribing, and re-rendering our component when the application state has changed. This will allow us to simplify our counter subscriber to as follows:

“`csharp

@using StateManagement.State

@inherits BaseSubscriber

<p>Current count: @Store.State.Count</p>

@code {

}

“`

Our counter subscriber inherits from BaseSubscriber and now contains minimal code. Our final product is vastly smaller and easier to understand than our original implementation.

In-memory state management is just one way of tackling the issue of state in Blazor applications. When implemented correctly, your development team can have an easily understandable solution for passing around events and states in your application.

Making Digital Practical with Saxony Partners

Technology and digital strategy can be complicated, but our goal at Saxony Partners is simple: Make Digital Practical.

Saxony Partners will meet you where you are and help you get where you want to go. Our pragmatic approach helps ensure early success by leveraging proven technologies and practical solutions in a cost-effective way.

Our team of app dev experts, full-stack developers, and software engineers work with clients to optimize their technology investments and leverage that technology to meet and solve business needs and challenges.

If you or your company is looking for help with software development, reach out to us here.