[Bug]: MudExSelect freezing the whole app

[vukasinpetrovic]

Contact Details

No response

What happened?

I'm experiencing ultra slowdown when I use MudExSelect. It happened in old versions, it happens now with the latest.
Only difference is that it does not happen anymore on local maching with the latest version, but it clogs down the Azure App Service it's hosted on.

While I type this I think I have a hint. When I open the select or click one of it's elements, it does enourmous amount of data transfer over signalR connection (in safari network tab, it reported 11+MB of data). I checked in chrome as well, where you can see on the screenshot below that it constantly transfers some code, over and over again. I'm not sure why, but I hope that this can be fixed easily.

Here are also two recordings, one is from safari where you can see that data transfer and another one is from chorme, where you can see how long it waits for the UI to be responsive (to open the select and also when i click on items). It probably waits for that data transfer to finish and then UI is responsive after that.

Here is also the code for the select you are seeing on the screen:

<MudExSelect Variant="Variant.Text" @bind-SelectedValues="@selectedPersonalityTraits"
                 MultiSelection="true" Required="true" GroupingEnabled="true" GroupBy="@(x => x?.Group)" ToStringFunc="@(x => x?.Name)"
                 ItemCollection="personalityTraits" SearchBox="false" T="PersonalityTrait" Label="Choose desired personality traits..." 
                 AnchorOrigin="Origin.BottomCenter">
    </MudExSelect>

private IEnumerable<PersonalityTrait> selectedPersonalityTraits;
    private static PersonalityTrait[] personalityTraits =
    [
        new() { Group = "Innovator", Name = "Sociable" },
        new() { Group = "Innovator", Name = "Enthusiastic" },
        new() { Group = "Innovator", Name = "Eloquent" },
        new() { Group = "Innovator", Name = "Dynamic" },
        new() { Group = "Innovator", Name = "Detail-Averse" },
        new() { Group = "Driver", Name = "Determined" },
        new() { Group = "Driver", Name = "Competitive" },
        new() { Group = "Driver", Name = "Rational" },
        new() { Group = "Driver", Name = "Demanding" },
        new() { Group = "Driver", Name = "Logical" },
        new() { Group = "Collaborator", Name = "Empathetic" },
        new() { Group = "Collaborator", Name = "Relationship-oriented" },
        new() { Group = "Collaborator", Name = "Trusting" },
        new() { Group = "Collaborator", Name = "Patient" },
        new() { Group = "Collaborator", Name = "Harmony seeker" },
        new() { Group = "Perfectionist", Name = "Methodical" },
        new() { Group = "Perfectionist", Name = "Reserved" },
        new() { Group = "Perfectionist", Name = "Careful" },
        new() { Group = "Perfectionist", Name = "Precise" },
        new() { Group = "Perfectionist", Name = "Analytic" }
    ];

Expected Behavior

Select does not clog the signalR connection and UI response is normal.

Screenshots

Screen.Recording.2025-07-18.at.11.29.35.mov

Screen.Recording.2025-07-18.at.11.30.31.mov

Reproduction link

No response

What application type are you referring to?

ServerRendered

Custom Application Type

No response

MudBlazor.Extension Version

8.9.0

MudBlazor Version

8.9.0

What .net Version are you using?

.Net9

What browser are you using?

Chrome

Sample Solution

No response

Pull Request

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[vukasinpetrovic]

NOTE: On the localhost UI is fast as that signalR is instant, but when you deploy it somewhere, then you notice that 11MB transfer hogs everything. But thankfully I saw it in the network tab. Anyway, it's visible also on localhost in network tab, just not visually as localhost is instant for that Server rendering.

[vukasinpetrovic]

@fgilde Looks like I found a solution, but I'm not sure why it's happening.

If I register extensions without automatic css loading:

builder.Services.AddMudServicesWithExtensions(c => c.WithoutAutomaticCssLoading());

and add css manually to App.razor

    <link id="mudex-styles" href="@Assets["_content/MudBlazor.Extensions/mudBlazorExtensions.min.css"]" rel="stylesheet">

Then it works fine, blazor signalR does not tranfer massive data and thus does not get cloged.

One more note:
Even with that, I still see significan data transfer over signalR when I scroll through the select elements, click them, etc. Maybe that can be also checked up.

Thank you!

[fgilde]

I will Check this after my vacation. Thanks.