Which should I use, Blazor WebAssembly or Blazor Server?

Question

Which should I use, Blazor WebAssembly or Blazor Server?

Laurent Guigon 311

I'm trying to decide which option to choose. I plan to develop two applications using Blazor. The first one is intended to be a wiki-type application. The second one is an online manager for the Palladium RPG (specifically for Macross/Robotech RPG), involving player sheet management and combat management. The Palladium combat system can be quite challenging, so I'd like to focus on combat narration and have the application handle the entire combat process.

For both applications, I intend to utilize the API backend supported by Blazor WebAssembly/Blazor Server app. Perhaps in the future, I might develop the frontend using Angular, React, or another JavaScript-based framework.

I aim to employ the embedded user management system that allows me to utilize AspNetUser, AspNetRole, etc., and page scaffolding. However, Duende doesn't fit my requirements (it's too expensive!). I am considering deploying my apps on Azure. Initially, my wiki will be hosted on a local machine as a server (IIS server) and won't be available on the internet (I plan to sell my book before making the wiki available online for readers). At the moment, it functions as a database for my personal use.
For my RPG app, I would like to implement a real-time refresh system. Essentially, when a player engages in a fight with an adversary, such as the adversary firing missiles at the player's mecha and causing damage, it would be beneficial if the player's character sheet updated in real-time. I envision a system akin to instant messaging platforms like Messenger, WhatsApp, Hangouts, etc., allowing for immediate updates and synchronization during the gameplay.

The main question for now is Blazor WebAssembly or Blazor Server app. If you have any tips for my future development, I would appreciate them!

AgaveJoe 30,126 Reputation points

2023-12-06T16:19:42.85+00:00

Blazor is an SPA that runs in the browser. There is no logical reason to develop a front end in Angular, React, or another JavaScript-based framework if you've developed a Blazor application.

Blazor Web Assembly runs components client side. Blazor Server runs components server side over a SignalR (persistent) connection.

See the official documentation to learn the basics before making a decision.

ASP.NET Core Blazor hosting models
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2023-12-07T08:17:53.5433333+00:00

Well, the choice between Blazor WebAssembly and Blazor Server depends on your specific use cases also depending on performance considerations, and preferences regarding deployment along with real-time updates.

Both options can be suitable based on your scenario, and you may find that a combination of both aligns with different aspects of your applications.

However, you could also consider the hybrid approach as well. But I according to your scenario, I would prefer or recommend Blazor Server for your applications. It's because:

1. Blazor Server, has the real-time capabilities through SignalR, aligns well with your requirement for immediate updates and synchronization during gameplay in the RPG manager application.

2. Another considering point is Blazor WebAssembly could be a good fit for offline scenarios, your local wiki application could still benefit from real-time updates and the simplicity of server-side execution provided by Blazor Server

But yeah, as said earlier, its completely depends on how you would be going to use them. Both can be used in order to meet your requirement.

Accepted answer

0 additional answers

Your answer

AgaveJoe 30,126 Reputation points

2023-12-06T16:19:42.85+00:00

Blazor is an SPA that runs in the browser. There is no logical reason to develop a front end in Angular, React, or another JavaScript-based framework if you've developed a Blazor application.

Blazor Web Assembly runs components client side. Blazor Server runs components server side over a SignalR (persistent) connection.

See the official documentation to learn the basics before making a decision.

ASP.NET Core Blazor hosting models
Farid Uddin Kiron MSFT 456 Reputation points Microsoft External Staff

2023-12-07T08:17:53.5433333+00:00

Well, the choice between Blazor WebAssembly and Blazor Server depends on your specific use cases also depending on performance considerations, and preferences regarding deployment along with real-time updates.

Both options can be suitable based on your scenario, and you may find that a combination of both aligns with different aspects of your applications.

However, you could also consider the hybrid approach as well. But I according to your scenario, I would prefer or recommend Blazor Server for your applications. It's because:

1. Blazor Server, has the real-time capabilities through SignalR, aligns well with your requirement for immediate updates and synchronization during gameplay in the RPG manager application.

2. Another considering point is Blazor WebAssembly could be a good fit for offline scenarios, your local wiki application could still benefit from real-time updates and the simplicity of server-side execution provided by Blazor Server

But yeah, as said earlier, its completely depends on how you would be going to use them. Both can be used in order to meet your requirement.

Answer 1

Bruce (SqlWork.com) 78,006 Volunteer Moderator

Blazor server hosts the client app instance on a dedicated thread on the server (one thread per client connection). a small js app runs in the browser that opens a signal/r connection to the server app. it sends events to the server app via this connection. the server app sends html updates to the js app also via the connection, which renders the dom updates.

Blazor WASM is a Blazor app hosted in the browser. Other than initial download, no server connection is required. It still uses js to update the browser, but its a local message.

Blazor server can make any api calls supported by the server (database, O/S, etc). Blazor WASM can use any api available to browser js (as can Blazor server via interop, but there is a network hop).

Blazor server requires a persistent connection to the server. Blazor WASM can run offline.

Blazor server UI performance depends on network latency. The UI events and updates are in the riser, the blazor code is on the server. You would not want to do mouse tracking for instance.

Blazor WASM main performance hit is the initial app load.

Laurent Guigon 311 Reputation points

2023-12-07T16:28:49.95+00:00

I am going to start with a new structure for my projects. It will be less of a hassle, and I have very little code already implemented (just the data seed, which I will put in a separate DLL; also, I need to use this data seed to create my Docker integration environment? Azure? something that is created on each integration and then destroyed to return to a clean initial state)...

My target application architecture becomes:

Blazor Server

.NET Core Identity

API

Shared DTO layer between BS and API

Isolated DLL for the data seed.

I would like to secure access to my API, maybe by using .NET Core Identity to have AspNetUser & roles on the API side, with all the attributes like [Authenticated], [Roles=...].

And since .NET Core 8 is available, that will be the framework version used.

Any advice, please?

And if you have links to documentation (preferably YouTube), I would appreciate it!

Thank you, best regards.
Bruce (SqlWork.com) 78,006 Reputation points Volunteer Moderator

2023-12-07T23:03:14.89+00:00

a UI server calling an api with user credentials is typically done with oauth tokens. this means you will need an oauth server, or need to cobble your own together.

Microsofts oauth offering is azure ad. the individual account oauth template uses the 3rd party Duende IdentityServer (replacement for the open source IdentityServer4). While free for dev, it costs for production.

Why would the UI layer have a DTO? Blazor Server is already pretty heavy, so I would have thought it only had UI code and rules, and would make an api call to the BI layer which used the DTO.
Laurent Guigon 311 Reputation points

2023-12-08T11:58:25.4433333+00:00

If I understand correctly, using a separate API and Blazor Server would be similar to using WebAssembly (Wasm) and would require something like Duende?

My plan is to utilize a Blazor application as the frontend, coupled with an API handling all business processes. If, in the future, I decide to switch from Blazor to a JavaScript-based frontend, all the models and functionalities will still function because they reside within the API. The only task would involve building a new frontend application. However, the data access, business logic, and business model would remain the same as in the previous development phase (as the API will still be operational). In essence, the core of my application lies in the API, while the presentation layer is represented by my Blazor app, much like the functionality of WebAssembly. However, I do not intend to install the app on the client's browser, so WebAssembly is not the solution I'm seeking.

But maybe my approach isn't correct. Blazor Server seems to have been designed as a monolithic element that includes UI, Business Layer, etc., with .NET Core Identity, but lacks something like Duende! In short, a client-server app... are you saying this is only achievable with WebAssembly?

PS I watch a video about .Net core 8 and I'll try a Blazor Web App...
But I still want to use Identity and Secured API...
AgaveJoe 30,126 Reputation points

2023-12-08T19:25:35.5233333+00:00

Web API is commonly secured using a bearer token. Client code passes the token to the API and the API validates the token before authorizing access to secured API resources. The type of client does not matter it could be Blazor Server, Web assembly, MVC, Razor Pages, JavaScript, or a testing utility.

As mentioned above, Duende is a token server (OAuth) which you can add to a .NET solution. It is a separate web application. Or you can roll your own token service in Web API. Or you can use a 3rd party OAuth service.

Blazor Server does not automatically include a Business Layer. You as a developer design the business layer and if the business layer is within the Blazor application that's because you put it there.
Laurent Guigon 311 Reputation points

2023-12-09T11:07:19.3166667+00:00

Ok, thanks.
So I have to find an alternative to Duende or to code one myself...
AgaveJoe 30,126 Reputation points

2023-12-09T11:14:08.8133333+00:00

So I have to find an alternative to Duende or to code one myself...

The third option is using a Azure AD or a similar OAuth service. Please read the links.

How to use Identity to secure a Web API backend for SPAs

Overview of ASP.NET Core authentication

Introduction to authorization in ASP.NET Core

You can also try creating a .NET 8 Blazor Server or Web Assembly app with the Individual Account option. Both projects use an authentication cookie rather than a token. If your project is does not have remote clients then this might be a good option.

Share via

Which should I use, Blazor WebAssembly or Blazor Server?

0 additional answers

Your answer