Welcome to a collection of Fusion samples!

All project updates are published on its Discord Server; it's also the best place for Q/A.

Check out Board Games - the newest Fusion sample that implements both Blazor Server and WASM modes, 2 games, chat, online presence, OAuth sign-in, user session tracking, and a number of other 100% real-time features. All of this is powered by Fusion + just 35 lines of code related to real-time updates!

What's Inside?

0. Solution Templates

We don't provide dotnet new-based templates yet, but you can find template solutions to copy in templates/* folders.

Templates are also included into Samples.sln, so you can try any of them by opening this solution & running one of template .csproj files.

1. HelloCart and HelloWorld Samples

HelloCart is a small console app designed to show how to implement a simple Fusion API by starting from a toy version of it and gradually transition to its production-ready version that uses EF Core, can be called remotely, and scales horizontally relying on multi-host invalidation.

"QuickStart: Learn 80% of Fusion by walking through HelloCart sample" is the newest part of Fusion Tutorial that covers specifically this sample. Check it out!

And HelloWorld shows how to create an incremental build simulation on Fusion. Nothing is really built there, of course - the goal is to shows how Fusion "captures" dependencies right when you use them and runs cascading invalidations.

If you're choosing between HelloWorld and HelloCart - play with HelloCart first. It is also a sample covered in QuickStart part of the Fusion Tutorial.

2. HelloBlazorServer and HelloBlazorHybrid Samples

HelloBlazorServer is the default Blazor Server App modified to reveal some Fusion powers. Contrary to the original app:

• It displays changes made to a global counter in real-time
• Similarly, it updates weather forecasts in real-time
• A new "Simple Chat" sample shows a bit more complex update scenario and features a simple chat bot.

If you're curious how big is the difference between the code of these samples and a similar code without any real-time features, check out this part of Fusion README.md.

HelloBlazorHybrid is the same sample, but modified to support both Blazor Server and Blazor WebAssembly modes.

3. Blazor Samples

Play with live version of this app right now!

It's a dual-mode Blazor SPA hosted by ASP.NET Core website, which also serves its API. The application includes:

• "Server Time" and "Server Screen" pages showing the simplest timeout-based invalidation
• "Chat" – a tiny chat relying on event-based invalidation
• "Composition" shows how Fusion tracks and updates a complex state built from the output of Compute Services (local producers) and Replica Services (remote producers)
• "Authentication" – a GitHub authentication sample with Google-style real-time session tracking, "Kick", and "Sign-out everywhere" actions.

Check out a 7-min. video walk-through for this sample - the animations below show just some of its features.

Note that "Composition" sample shown in a separate window in the bottom-right corner also properly updates everything. It shows Fusion's ability to use both local IComputed<T> instances and client-side replicas of similar server-side instances to compute a new value that properly tracks all these dependencies and updates accordingly:

• First panel's UI model is composed on the server-side; its client-side replica is bound to the component displaying the panel
• And the second panel uses an UI model composed completely on the client by combining server-side replicas of all the values used there.
• The surprising part: two above files are almost identical!

The sample supports both (!) Server-Side Blazor and Blazor WebAssembly modes – you can switch the mode on its "Home" page.

Moreover, it also exposes a regular RESTful API – try invoking any of endpoints there right from embedded Swagger console.

4. Caching Sample

It's a console app running the benchmark (Client) + ASP.NET Core API Server. Its output on Ryzen Threadripper 3960X:

Local services:
Fusion's Compute Service [-> EF Core -> SQL Server]:
  Reads         : 27.55M operations/s
Regular Service [-> EF Core -> SQL Server]:
  Reads         : 25.05K operations/s

Remote services:
Fusion's Replica Client [-> HTTP+WebSocket -> ASP.NET Core -> Compute Service -> EF Core -> SQL Server]:
  Reads         : 20.29M operations/s
RestEase Client [-> HTTP -> ASP.NET Core -> Compute Service -> EF Core -> SQL Server]:
  Reads         : 127.96K operations/s
RestEase Client [-> HTTP -> ASP.NET Core -> Regular Service -> EF Core -> SQL Server]:
  Reads         : 20.46K operations/s

What's interesting in this output?

• Fusion-backed API endpoint serving relatively small amount of cacheable data scales to ~ 130,000 RPS while running the test on the same machine (that's a disadvantage).
• Identical EF Core-based API endpoint scales to just 20K RPS.

So there is a ~ 6.5x difference for an extremely simple EF Core service hitting a tiny DB running in simple recovery mode. In other words, use of Fusion on server-side only brings ~ an order of magnitude performance boost even when there is almost nothing to speed up!

Besides that, the test shows Replica Services scale ~ almost as local Compute Services, i.e. to ~ 20 million "RPS". These aren't true RPS, of course - Replica Service simply kills any RPC for cached values that are known to be consistent. But nevertheless, it's still a pretty unique feature Fusion brings to the table – and that's exactly what allows it Blazor samples to share the same code for both WASM and SSB modes. So even though Replica Service is just a client for remote Compute Service, its performance is very similar!

5. Tutorial

It's interactive – you can simply browse it, but to modify and run the C# code presented there, you need Try .NET or Docker.

Running Samples

Build & run locally with .NET 5.0 SDK:

# Run this command first
dotnet build

Sample	Command
HelloCart	dotnet run -p src/HelloCart/HelloCart.csproj
HelloWorld	dotnet run -p src/HelloWorld/HelloWorld.csproj
HelloBlazorServer	dotnet run --project src/HelloBlazorServer/HelloBlazorServer.csproj + open http://localhost:5005/
HelloBlazorHybrid	dotnet run --project src/HelloBlazorHybrid/Server/Server.csproj + open http://localhost:5005/
Blazor Samples	dotnet run --project src/Blazor/Server/Server.csproj + open http://localhost:5005/
Caching	Run-Sample-Caching.cmd. See Run-Sample-Caching.cmd to run this sample on Unix.
Tutorial	Install Try .NET + dotnet try --port 50005 docs/tutorial

Build & run with Docker + Docker Compose:

# Run this command first
docker-compose build

Sample	Command
HelloCart	docker-compose run sample_hello_cart dotnet Samples.HelloCart.dll
HelloWorld	docker-compose run sample_hello_world dotnet Samples.HelloWorld.dll
HelloBlazorServer	docker-compose run --service-ports sample_hello_blazor_server + open http://localhost:5005/
HelloBlazorHybrid	docker-compose run --service-ports sample_hello_blazor_hybrid + open http://localhost:5005/
Blazor Samples	docker-compose run --service-ports sample_blazor + open http://localhost:5005/
Caching	docker-compose run sample_caching_client dotnet Samples.Caching.Client.dll
Tutorial	docker-compose run --service-ports tutorial + open https://localhost:50005/README.md

Useful Links

• Check out Fusion repository on GitHub
• Go to Documentation Home
• Explore Board Games - a real-time multiplayer board gaming app built on Fusion
• Join our Discord Server to ask questions and track project updates.

P.S. If you've already spent some time learning about Fusion, please help us to make it better by completing Fusion Feedback Form (1…3 min).