Blazor

3 min read


Hello Stacker, how about we talking about WASM or we know as Web Assembly? Web Assembly uses a low-level language or a machine-oriented language. This process is very fast, even if it is already to be far beyond the runtime speed of the current modern web. So during my experience as a developer if the program already big, the boring part is waiting for the process of building / compiling a program that we has been built. And there are also times consuming when the program or web is slow to load content so that from the performance side of the server itself, It becomes easy to consume a lot of resources on server. The solution is we need upgrade the server hardware. This is why we thinking as developers when building a web system, especially one that has SSR (Server Side Rendering) which makes us spend more effort in the development processes. In the web assembly itself, because it uses a low-level language just like when we first learned C programming, the compiling it feels very fast and the runtime for low specification machines is still able to run the program smoothly.

Blazor how-tos: status from a background task - David Guida

Build client web apps with C#

Blazor

For this first time we start using Blazor as our Web Assembly, and for Windows we able to Install it on Visual Studio Application and create new Blazor project.

And Blazor already give boilerplate to make a starter project.

And we can Edit on Pages/Index.razor which is a file contains Home Content :

@page "/"

<PageTitle>Index</PageTitle>

<h1>Hello, world!</h1>

Welcome to your new app.

<SurveyPrompt Title="How is Blazor working for you?" />

Additional

  • Blazor can run your client-side C# code directly in the browser, using WebAssembly. Because it’s real .NET running on WebAssembly, you can re-use code and libraries from server-side parts of your application. Alternatively, Blazor can run your client logic on the server. Client UI events are sent back to the server using SignalR – a real-time messaging framework. Once execution completes, the required UI changes are sent to the client and merged into the DOM.Tooltip: The document object model(DOM) is a programming interface that represents all elements on an HTML page as nodes in a tree structure. Using the DOM, elements can be updated, added, and removed from the page.
  • Build native client apps using existing Blazor web UI components with Blazor Hybrid. Share the same Blazor components across mobile, desktop, and web while taking advantage of full access to native client capabilities. Use Blazor Hybrid to build cross-platform apps with .NET MAUI, or to modernize existing WPF and Windows Forms apps.
  • Blazor uses open web standards without plug-ins or code transpilation.Tooltip: Transpilation is the process of converting code written in one programming language to another. Transpilation to JavaScript is a common approach to enabling languages to run in the browser, but often provides limited functionality. Blazor works in all modern web browsers, including mobile browsers. Code running in the browser executes in the same security sandbox as JavaScript frameworks. Blazor code executing on the server has the flexibility to do anything you would normally do on the server, such as connecting directly to a database.
  • Blazor apps can use existing .NET libraries, thanks to .NET Standard—a formal specification of .NET APIs that are common across all .NET implementations. .NET Standard allows the same code and libraries to be used on the server, in the browser, or anywhere you write .NET code.
  • Your C# code can easily call JavaScript APIs and libraries. You can continue to use the large ecosystem of JavaScript libraries that exist for client side UI while writing your logic in C#. When using server-side code execution, Blazor takes care of seamlessly executing any JavaScript code on the client.

Blazor can be a good opportunities for us for building Web Assembly project. As usual for the full documentation you can found in here and cyaa..

Bima Sena

Leave a Reply

Your email address will not be published. Required fields are marked *