DEV Community

Sabah Shariq
Sabah Shariq

Posted on

Blazor and WebAssembly

Introduction

In our previous blog post we learnt that with the use of Blaze web framework we can use C# for both server and client development instead of using Javascript on client side. This is possible because of usage of WebAssembly. We will now look into how Blazor leverage this WebAssembly.

WebAssembly:

WebAssembly (abbreviated wasm) is Open Web standard which is a new type of code that can be run in web browsers. It is primarily designed to be an effective compilation target for source languages like C, C++, Rust, C# etc. on the web at near-native speed, that previously couldn’t have possible. The main goal of WebAssembly is to enable high-performance applications on web pages. This means for the blazor application to work, there is no need to recompile C# code into another language or install any special plugins like back in the days of silver light and flash.

WebAssembly code can access the full functionality of the browser via JavaScript. .NET code executed via WebAssembly in the browser runs in the browser's JavaScript sandbox with the protections that the sandbox provides against malicious actions on the client machine.

Blazor:

Blazor is a single page application framework i.e SPA. This means .NET developers can reuse their C# skills rather than learning new JavaScript frameworks. As WebAssembly is part of all modern browsers including mobile browsers, application developed in Blazor can run natively without the need of any external plugin.

Blazor WebAssembly apps run on the browser using a .NET Intermediate Language (IL) interpreter implemented in WebAssembly. into WebAssembly. Everything that the application needs will be downloaded on to the browser and executed.

When a Blazor WebAssembly app is built and run in a browser:

  • C# code and Razor files are compiled into .NET assemblies.
  • The assemblies and the .NET runtime are downloaded to the browser.
  • Blazor WebAssembly runtime uses JavaScript interop to handle DOM manipulation and browser API calls.

In our next blog post we will look into details on Blazor Server App and Blazor WebAssembly App here.

Top comments (0)