Blazor_WASM Part 1: Overview of Blazor

Blazor_WASM Part 1: Overview of Blazor

Blazor is a framework for generating interactive client-side web UIs using Blazor:

• Use C# instead of JavaScript to create informative, interactive UIs.
• Share server-side and client-side application logic written in .NET.
• Renders the UI to HTML and CSS to support a wide range of browsers, including mobile browsers.
• Integrate with modern hosting platforms like Docker .
• Build hybrid desktop and mobile apps using .NET and Blazor.

Using .NET for client-side web development offers the following advantages:

• Use C# instead of JavaScript to write code.
• Leverage the existing .NET library ecosystem.
• Share application logic between server and client.
• Benefit from the performance, reliability, and security of .NET.
• Stay productive on Windows, Linux or macOS using a development environment such as Visual Studio or Visual Studio Code .
• Build on a stable, feature-rich, and easy-to-use set of common languages, frameworks, and tools.

Blazor supports two modes of operation, one is to run on the client side using WebAssembly, and the other is to run on the server side and directly render to the browser.

Official introduction of Blazor

Blazor Server mode

Blazor Server supports hosting Razor components on the server in ASP.NET Core applications. UI updates can be handled over a SignalR connection.

The runtime stays on the server and processes:

• Execute the application's C# code.
• Send UI events from browser to server.
• Applies UI updates to rendered components sent back by the server.

The connection that Blazor Server uses to communicate with the browser is also used to handle JavaScript interop calls.

Blazor WebAssembly patterns

Blazor WebAssembly is Blazor WebAssembly for building interactive client-side web apps using .NET. Blazor WebAssembly uses open web standards without plugins or recompilation of code into other languages. Blazor WebAssembly works with all modern web browsers, including mobile browsers.

With WebAssembly (acronym for short), .NET code can be run inside a web browser. WebAssembly is a compressed bytecode format optimized for fast downloads and maximum execution speed. WebAssembly is an open web standard supported for use in web browsers without plugins.

WebAssembly code can access the full functionality of the browser through JavaScript (known as JavaScript interoperability, often shortened to JavaScript interop or JS interop). .NET code executed through WebAssembly in the browser runs in the browser's JavaScript sandbox, which provides protection against malicious actions on the client computer.

Blazor WebAssembly is more in line with the current development method of front-end and back-end separation, and it is also a trend in the future. This series of blog posts mainly explains Blazor WebAssembly.