Blazor is a new Microsoft technology that allows developers to write code for browsers in C#. This article compares Blazor to three other common SPA frameworks: React, Angular, and Vue.js. JavaScript is currently the most popular language for browser-based Single Page Applications (SPAs) because up until recently, it’s been the only language that runs inside the browser. These frameworks compile or transpile from JavaScript or TypeScript. This article asks whether developers need to depend on JavaScript and whether we can start building SPA apps with C# yet.

What is Blazor?

Blazor is .NET based SPA framework for web and mobile and part of the ASP.NET Core web framework. Blazor uses the existing and familiar HTML Document Object Model (DOM) with CSS styling to present and process UI components. However, instead of JavaScript, Blazor uses C# for processing so developers can share code across platforms. Blazor declares HTML with Razor script, which is familiar to ASP .NET Core developers. Razor brings the developer close to HTML by maintaining a light syntax that allows direct HTML definitions but allows for data binding, iterations, and variable definitions.

Processing occurs on the .NET runtime on the server or client-side. In the case of the server-side, the HTML DOM is rendered on the server and then fed to the browser with Signal-R. The full .NET Core runtime is available. On the client-side, Mono runs on WebAssembly inside the browser. Mono on WASM is due for an upgrade to .NET 5 soon. WASM opens up the full power of .NET without needing server-side rendering or additional browser plugins.

Blazor brings technology that allows developers to bundle Blazor UI into desktop and mobile apps. Electron allows developers to build desktop apps with HTML and CSS. Electron.Net is one technology that bridges the gap and allows this to work with Blazor. Microsoft has built experimental bindings for native mobile apps. This is probably an indication that Blazor apps are going to run on platforms such as iOS and Android.

Features of Blazor

• Build Web UIs with C# instead of JavaScript or TypeScript
• Build Progressive Web Apps (PWAs)
• Create and use reusable components written in C#
• Full debugging support on the server-side and debugging with some limitations on the client-side
• Data binding with the HTML DOM (limited two-way binding)
• Share code between client and server in C#
• Works in all modern web browsers including mobile browsers
• Blazor code has the same security sandbox as JavaScript
• Use JavaScript interop to call JavaScript frameworks and libraries
• Open-source

#blazor #react #angular #vue #javascript