How does Blazor Work?

Blazor is particularly well-suited for the MVVM (Model-View-ViewModel) pattern, which helps organize the migrated code.

Blazor standard flow

The interaction follows a precise 7-step cycle:

  1. DOM Event: The user clicks a button or interacts with the browser.

  2. Event Relay: The click is sent over a WebSocket connection to the server-side View Model.

  3. State Change: The View Model runs the original business logic and updates the Model (data).

  4. View Model Update: The View Model detects the data change and tells the HTML renderer to refresh.

  5. HTML Rendering: The renderer calculates the difference (delta) between the old view and the new one.

  6. Visual Delta Transport: Only that tiny change is streamed back to the browser asynchronously.

  7. DOM Update: The browser's "Client Proxy" updates the specific part of the screen the user is looking at.

Last updated