fix: Erratic flickering when changing values in FluentNumberField on InteractiveServer

[johnW-ret]

🐛 Bug Report

Rapidly changing input values of FluentNumberField causes flickering in InteractiveServer mode in below video:

20241012-2132-51.4059115.mp4

💻 Repro or Code Sample

Get repro

Option 1, create yourself:

1.  dotnet new fluentblazor -o LoopingSignalRGlitch -f net8.0
    cd .\LoopingSignalRGlitch\
    dotnet new sln
    dotnet sln add .

2. Replace Pages/Counter.razor, replace lines past FluentButton with

   <FluentNumberField @bind-Value="leading">
       Leading Period
   </FluentNumberField>
   
   <InputNumber @bind-Value="leading2" />
   
   @code {
       private int currentCount = 0;
       public int leading;
       public int leading2;
   
       private void IncrementCount()
       {
           currentCount++;
       }
   }

Option 2, clone

https://github.com/johnW-ret/LoopingSignalRGlitch

Execute

1. dotnet watch or debug with hot reload from Visual Studio
2. Enable 3G (or any) throttling from the Network tab in the browser and refresh the page
3. Spam the FluentNumberField component as in the video

💁 Possible Solution

No idea but would be willing to contribute a fix pending feedback. I wanted to make this issue asap.

🔦 Context

My original repo which updates a chart on value change with a bind-Value:after. I was not testing with 3G at this time, and the issue in the video would happen often with no throttling. After removing all of these effects in test, it appeared to alleviate the issue, but I couldn't get rid of it completely. Switching to 3G seemed to make it happen more often, as you can see in the repro, but I would like to emphasize it does not only happen in 3G and the issue should not be dismissed as not pertaining to real-world constraints.

I understand SignalR does not work well with slow network connections, but this issue doesn't happen with the standard Blazor input components so I take this as an issue with FluentInputField specifically.

🌍 Your Environment

• Windows 11 Surface Laptop Studio
• Microsoft Edge Version 129.0.2792.79 (Official build) (64-bit)
• .NET 8.0.403 and Fluent UI Blazor library Version 4.10.2
• localhost and rapsberry pi in docker containing

[vnbaaij]

Will be fixed with PR mentioned in next release.