Blazor WASM is amazing, build apps super fast

A refresher

Since the beginning of the “mature” web, javascript has been the king of browser scripting languages, the go-to for any serious site, it offers DOM manipulation and enables reactivity on otherwise static HTML, and great apps have been made with it (Did you know Github doesn’t use a framework). Unfortunately, javascript was not properly designed, if at all, it was hacked together in a short period of time and we can feel the effects of it today with inconsistent APIs, multiple null types, and lack of proper types.

Typescript, created by Microsoft, aimed to fix it, but that is merely putting a band-aid on a big leak. There is only compile-time type safety, no JSON validation, and node_modules is filled with thousands of tiny files that need not exist.

Now this is not to say that the JS runtime is not effective at doing its job, on the contrary, it excels at manipulating the DOM to update the UI and fetching data from a server, but it is my strong belief that it should not be used in the backend, and it is by no means performant compared to Java, C#, Rust and C++ (which you should use sparingly).

A new way of running code from browsers was created that complements (and could eventually replace) the JS runtime, Webassembly. It is a VM that runs “web native” instructions, which executes magnitudes faster than JS in some cases.

Now comes Microsoft again, with a revolutionary new idea, this time, bring a compiled language with proper type safety into the browser and let it render the UI (mostly) without Javascript. (the language is C#).

What Blazor WASM is not

Web frameworks like Next, Nuxt, SvelteKit are built with SEO in mind, but the SPA client-side only nature of Blazor WASM (another article on Blazor Server coming soon) means it will be very hard to index pages reliably. Another downside is the initial bundle size of the app, which can range from 800 KB to 5 MB for a blank app, depending on the compilation mode (dynamic code vs statically compiled). Note that the app is only downloaded once.

I wouldn’t recommend Blazor as a website, but rather a “web app”, which is what it is, an app running in the browser.

Why I love it so much

I started coding as a C# developer using WinForms about 5 years ago, and I fell in love with it (obviously not the WinForms part). The language provides amazing type safety, error messages and handling, good separation of concerns, complete standard library, seamless tooling, and generally packed with more features than you would ever want or need. May I also note that it is open source. Well, now it can run in the browser so we can distribute apps directly via the browser to our clients, amazing isn’t it?

Blazor WASM offers a good package, as it features dependency injection, HTML templating via C# statements, CSS class templating, the entire class library of the .NET runtime, and if need be, javascript/typescript interop.

I code all my web APIs in ASP.NET C#, and that means I have tons of models, validators and helper methods as part of the backend. Now, what if I could offload part of the work to the client without writing a single line of Javascript? Well, the subject of this article is a perfect fit for this use case, you can simply move your C# code in a class library and use it in both the client and server. Transferring data has also never been easier, you can transmit JSON over HTTP or use gRPC or even SignalR, which all provide C#/.NET libraries that run in the browser via WASM.

Developer experience is very important, and sometimes JS frameworks give you cryptic error messages that will take you quite a while to debug and fix, but the error handling of the .NET runtime is amazing, you can diagnose and fix bugs in record time.

Blazor is also supported in mobile and desktop native apps via MAUI, but that is for another time.

Should I use Blazor WASM for my next project?

Well, as with most things in life, it depends! Say, is your app for existing business clients or for getting users via search engine listings? If the former, it is an amazing choice and I would recommend it any day, but if the latter, it may be worth considering other strategies, such as using an SSR framework (Nuxt is a favorite of mine). An admin panel, internal management tool or data visualizers are also good fits for Blazor.

Well, even if you don’t need to use this framework, I still highly recommend trying it out and making your own opinion out of it.

I will have more articles coming soon showcasing the power of Blazor.

Thanks for reading! Have a nice day or evening 🙂