Posts

HTML Invoker Commands in Blazor

Image
  Stop Using JS for Things the Browser Already Handles Blazor makes handling UI events in C# almost effortless. Because of that, it’s tempting to default to @onclick , component state flags, conditional rendering, and JS Interop for every basic interaction. But modern HTML has caught up. The browser now handles many of the small UI toggles we used to build manually. One of the most useful recent additions to web standards is HTML Invoker Commands . Invoker Commands allow an HTML element (usually a button) to declaratively tell another element to perform an action. For example, opening a modal: HTML < button commandfor = "detailsDialog" command = "show-modal" > View Details </ button > Notice what’s missing here: No JavaScript event listeners No Blazor @onclick handlers No bool _isOpen flags tracking visibility No JS Interop calls The browser manages the interaction directly. For Blazor developers, this brings up an important architectural ques...
Image
  Blazor Hybrid is an appealing option when you want a native Windows application without giving up Razor components, HTML, CSS, and the web UI development model. To explore that combination, I built a WPF application with four tabs: Home, Counter, Weather, and Batman Villains. The Counter and Weather pages began with the familiar Blazor template examples. The more interesting parts are the Home page, which became a two-column Batman villains threat board, and the Batman Villains page, which provides a reorderable watch list. Both pages support drag and drop inside a WPF-hosted WebView. This post briefly covers the hybrid infrastructure, then focuses on how the routed tabs and drag-and-drop UI work. The Hybrid Foundation The application is a WPF executable that hosts Razor components through BlazorWebView. There is no separate web server. WPF owns the desktop window and application lifetime, while Blazor renders the interface inside the embedded WebView2 browser control. The host w...

Turning a Blazor Server App into a Blazor Hybrid WPF App

Image
Blazor Server and Blazor Hybrid can both render Razor components, but they run in very different places. In a Blazor Server app, the UI is hosted by ASP.NET Core. The browser connects to the server over SignalR, user events travel back to the server, and the server sends UI updates back to the browser. In a Blazor Hybrid WPF app, the UI is hosted inside a native Windows desktop application. WPF owns the window, BlazorWebView renders Razor components through WebView2, and the components run in-process with the desktop app instead of over a network circuit. That means the main change is not rewriting your Razor UI. The main change is replacing the ASP.NET Core web host with a WPF desktop host. 1. Change the project type A Blazor Server app usually uses the Web SDK: <Project Sdk="Microsoft.NET.Sdk.Web"> For WPF Blazor Hybrid, the project needs Razor support plus WPF support: <Project Sdk="Microsoft.NET.Sdk.Razor">   <PropertyGroup>     <OutputType...

AI Writes the Code. You Still Need to Know Blazor.

Image
  Every few weeks, the same argument pops up in developer forums and team meetings: "Why bother mastering Blazor when AI can just write the code for us?" It’s an understandable reaction. Tools like GitHub Copilot, Claude, and Gemini can pump out hundreds of lines of working syntax in seconds. But this perspective misses a fundamental shift: AI hasn't eliminated the need for expertise. It has just changed where that expertise delivers value. Deep knowledge of the Blazor ecosystem is actually becoming more valuable, not less. AI can handle the mechanics of writing code, but you still have to engineer the solution. The Limits of Syntax Search Engines Think of AI as a hyper-fast assistant with an encyclopedic memory for APIs and zero tolerance for boilerplate boredom. It excels at execution, but it operates in a vacuum. It doesn’t inherently understand architectural trade-offs, production telemetry, or when a quick-and-dirty fix will evolve into a technical debt nightmare. Y...

Keeping Multiple Blazor Tabs in Sync with the Browser Broadcast Channel API

Image
  A user opens your Blazor application in one browser tab. Then they open a second tab, perhaps to compare information or keep two parts of the application visible at the same time. They change something in the first tab. Nothing happens in the second tab. This is expected. Each browser tab has its own page, JavaScript context, and Blazor Server circuit. Even though both tabs are displaying the same application for the same user, they don’t automatically share live state. You could solve this with SignalR, a server-side notification service, or a distributed messaging system. For many applications, however, that would be far more infrastructure than the problem requires. When the communication only needs to happen between tabs from the same application in the same browser, the browser already provides a lightweight solution: the Broadcast Channel API . In this article, we will examine: What developers sometimes mean by the “Broadcast API” What the Broadcast Channel API actually is ...