MAUI Blazor Hybrid has worse render performance than Blazor Server and WebAssembly

[JKGeovision]

For an upcoming project, we planned to use MAUI Hybrid to create both a Web App and a Native App.

To test whether it could meet the required performance, I created a small benchmark where data is requested from a database, iterated over, and for each item, an SVG rectangle is generated.

Surprisingly, contrary to my expectations, MAUI Hybrid had a higher rendering time than Blazor Server. I had anticipated that it would perform at least at the same level, if not faster.

Server	WebAssembly	WebAssembly AOT	MAUI Hybrid
82.7ms	79.8ms	56.3ms	109.6ms

Based on my research, others have also experienced performance issues due to data being marshalled between the .NET Runtime and the underlying WebView.

Are there any plans to improve this, or at the very least, provide an option to use WebAssembly in MAUI Hybrid?

[jfversluis]

Could you please share your research? What is the methods you have used? What is the project/app that you have used? What platforms did you try? Etc. In order to say something useful about this we will need a lot more details.

[JKGeovision]

Thank you very much for your reply.

Research:
This GitHub Issue I found faced a similar problem: dotnet/aspnetcore#43867

Method:
I have also created a minimal version of my benchmarking method in this repository: https://github.com/JKGeovision/MauiHybridBenchmark

Project:
.NET 9 MAUI Blazor Hybrid and Web App

Platform:
Windows x64

Version:
.NET 9.0.200

IDE:
Visual Studio 2022 17.14.0 Preview 2

Here are my benchmarking results depending on the amount of days displayed:

Benchmarking Results for Blazor Server:

1 Day	7 Days	14 Days	31 Days
20ms	25ms	45ms	81ms
20ms	22ms	42ms	75ms
20ms	24ms	42ms	79ms
19ms	23ms	43ms	75ms
20ms	21ms	42ms	78ms

Benchmarking Results for MAUI Hybrid:

1 Day	7 Days	14 Days	31 Days
24ms	23ms	50ms	89ms
23ms	29ms	48ms	95ms
23ms	23ms	47ms	89ms
21ms	23ms	50ms	91ms
22ms	23ms	51ms	92ms

If there is anything that's missing, please let me know.

Thank you and have a great day

[joshbartley]

@JKGeovision The JSON string you have is 4565 items. The recommended way is to use the Virtualize component to allow it to render X at a time. Our app has the capability to have millions or rows though we use the Virtualize component and API calls to only show 25 + (50 to overscan) at a time. I'm not sure how that would work with manually building a SVG though as I haven't ran the code myself.

I'm not sure if wrapping this in a component would help with the rendering lifecycle. Blazor server has Quiescence which may be the difference?

You are still talking at 31 days of data 10-15 ms difference which may still be able to be tweaked.

[JKGeovision]

@joshbartley Thank you for your reply.
I did test the benchmark with wrapping the SVG in a component, but it did not make a difference in the measured render time.

Of course, I could use Virtualize (don't know if that works horizontally) or not render very small time intervals in the SVG, which would most likely improve the performance, but I wanted to show there is a performance difference between MAUI Hybrid and Server.