> For the complete documentation index, see [llms.txt](https://docs.gapvelocity.ai/blazor-ai-migrator/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.gapvelocity.ai/blazor-ai-migrator/blazor-ai-migrator/modernization/how-does-blazor-work.md).

# How does Blazor Work?

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

<figure><img src="/files/PTGrafaD2fM9hCzUfUXY" alt="" width="375"><figcaption><p>Blazor standard flow</p></figcaption></figure>

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.