What Is Blazor and How Does It Work? [Review]

Introduction

Blazer net net is a new web framework developed by Microsoft that allows developers to build interactive web applications using C# and .NET instead of JavaScript. With Blazer net, you can leverage your existing .NET skills and reuse server-side .NET code on the client-side web app.

Recent Released: Hentairead – Keep your Children Away from Free Manga Websites

Since its inception in 2018, Blazernet has quickly grown in popularity among .NET developers due to its robust feature set and ease of use. This article provides an in-depth review of Blazernet, explaining what it is, how it works, its benefits and use cases, and more. Whether you are new to web development or an experienced .NET developer looking to modernize your skillset, read on to see if Blazernet may be suitable for your next project.

What is Blazer net?

Blazer net is an open-source web framework for building single-page applications (SPAs) using .NET and C#. It allows you to write client-side web UI (user interface) code in C# instead of JavaScript. The code you write in Blazer net is similar to C# code you would write for .NET server-side apps.

Blazernet apps are hosted on a web server and served to the client’s web browser similar to traditional web apps. However, unlike traditional web apps that run most logic on the server, Blazer net apps run the majority of the app logic on the client-side web browser.

There are two hosting models for Blazernet apps:

  • Blazer net Server – UI code is executed on the server from within an ASP.NET Core app. UI updates and event handling logic are handled over a SignalR connection.
  • Blazernet WebAssembly – UI code is executed directly in the browser using WebAssembly. Only necessary logic calls are made to the server.

In both models, we can leverage existing .NET code and libraries by calling C# functions from the client-side code. For example, you can call a C# class library from a Blazernet component the same way you would call it from a .NET Core controller.

How Blazer net Apps Work

Blazer net allows us to build interactive UIs by handling UI events and rendering updates directly on the client-side web browser using .NET and C#. To understand how this works, let’s take a closer look at the Blazernet architecture.

There are a few key components that allow Blazernet apps to run .NET code directly in the browser:

  • C# Code – We write C# UI logic code like we would write for a .NET server app. Reusable logic can be shared via class libraries.
  • .NET Runtime – The .NET runtime (CoreCLR) executes the C# code. For client-side Blazernet apps this runs on WebAssembly.
  • Interop – Interop enables interaction between JavaScript/WebAssembly and .NET at runtime.
  • Browser DOM – The Document Object Model (DOM), manipulated via JavaScript interop, handles rendering UI updates.

The .NET runtime and WebAssembly handle running, executing, and compiling the .NET and C# code within the browser. The interoperability bindings connect JavaScript to .NET, and vice versa, enabling access to the browser’s DOM from .NET. This is how the .NET code in Blazernet can render UIs and handle browser events.

Blazer net Server

In the Blazernet Server hosting model, UI event handling and rendering logic happens on the server via an ASP.NET Core app. The Blazernet app, UI event logic, and UI updates are handled over a real-time SignalR connection to the client.

The initial load of a Blazer net Server app serves a small bootstrap JavaScript file alongside the HTML and CSS. This bootstrap code sets up a SignalR connection back to the server to an ASP.NET Core app that is hosting the Blazernet app logic. UI events triggered by the user are sent over SignalR to the server. The server runs the event handling code and sends any UI updates back to the client over the same connection.

Most app logic code runs on the server inside the ASP.NET Core app using the full .NET Core framework. You can even access server-side databases and other services directly from the Blazer net UI code. The downside is no offline support, and higher latency than client-side only apps due to the round-tripping over SignalR.

Blazer net WebAssembly

For Blazer net apps using the WebAssembly hosting model, the app logic and UI code is executed directly in the browser using .NET and WebAssembly. WebAssembly is a relatively new web standard that allows a browser to run compiled code, like .NET DLLs, at near native speeds.

When a Blazernet WebAssembly app loads, it downloads the C# UI code and the .NET runtime compiled to WebAssembly. This allows the app to run entirely client-side after the initial load. UI events and rendering logic are handled directly in the browser without needing to round-trip back to the server.

To access server-side services the app can still make API calls to an ASP.NET Core web API or other backend services. The downsides are larger initial download sizes and lack of SEO support since search engine crawlers cannot fully execute WebAssembly code.

Benefits of Using Blazer net

Now that we’ve covered the basics of how Blazernet works, let’s discuss some of the key benefits it provides:

  • Leverage Existing .NET Skills – Since Blazer net uses C# and .NET, you can reuse existing skills and code. No need to context switch to JavaScript.
  • Improved Security – Execute code directly on .NET runtime with built-in security features instead of within JavaScript environments.
  • Full-stack .NET – Share code across client, server, and data access layers using consistent languages and tools.
  • Performance – Blazernet WebAssembly offers excellent performance by running on WebAssembly natively in the browser.
  • Scaling – Blazernet leverages modern web standards like WebAssembly enabling apps to scale across devices and browsers.
  • Open Source – Blazernet is open source and publicly developed allowing community contributions and transparency.

Additional benefits include smaller payload sizes due to code reuse across stack, full IntelliSense and debugging support in Visual Studio, and more. Using consistent languages and runtimes across the app stack unlocks productivity and maintains velocity across teams.

Blazer net Use Cases

Blazer net’s productivity benefits make it a great choice for a variety of app scenarios:

LOB Applications

Line-of-business apps like internal tools, ERPs, CRMs, and healthcare applications benefit from Blazernet’s full .NET stack approach. These apps usually rely heavily on accessing existing .NET services and databases that Blazernet integrates with seamlessly.

Real-time Applications

Blazer net’s support for SignalR makes it excel at building real-time web apps like chat, notifications, trackers, and collaboration tools. Both flavors of Blazernet make setting up real-time communication simple.

Progressive Web Applications

PWAs are web apps that take on native app-like capabilities working offline with access to device APIs. Blazernet WebAssembly’s offline support makes it ideal for this. Deploy your app to app stores easily.

Cross-platform Applications

Cross-platform ability helps teams build apps once yet run across multiple devices and operating systems. Blazernet compiles via WebAssembly to run natively regardless of client device or platform.

Embedded Applications

Blazernet WebAssembly opens the door for C# code to run on emerging edge computing devices for IoT and embedded devices without needing the full .NET runtime.

Prototyping

Blazer net’s excellent developer productivity and reuse makes it a great tool for rapidly prototyping and iterating on concepts when unsure of final stack choice or before bringing on a larger team.

Getting Started with Blazer net

To get a closer look at Blazernet in action and try it out yourself, let’s go through getting set up with a new Blazernet project in Visual Studio:

Install Tooling

Make sure you have the following tools installed:

Create New Blazer net App

  1. Launch Visual Studio and create a new project.
  2. Select Blazer net App and click Next.
  3. Choose a template to scaffold an app from – either Blazernet Server or Blazernet WebAssembly.
  4. Set a name and project location. Then select Create.
  5. After Visual Studio generates the starter Blazernet solution and downloads dependencies, you’re ready to start developing!

Explore the starter template to understand how Blazernet apps work. Make UI changes, add logic, call server APIs, and build out your app. Running the project will launch and render the app right in your browser on IIS Express. Congrats – you’ve created your first Blazer net app!

Additional Resources

For further learning here are other great Blazer net resources:

Conclusion

Blazer net enables building interactive web UIs using C# instead of JavaScript through WebAssembly and ASP.NET Core. It offers full-stack .NET leverage, excellent performance, and reuse of existing skills and code.

We discussed what Blazernet is, how it works, hosting models, use cases, benefits, and how to get started. Blazernet is an excellent choice for many modern web development projects, especially LOB apps relying on .NET framework services. Its continued growth points to a bright future ahead as it evolves the landscape of web and .NET development.

What questions do you still have about Blazer net? Let me know in the comments!

Leave a Comment