Performance issues

[gregsdennis]

I'm not sure what the culprit is as I'm pretty new to Blazor and not a FE dev, but I'm experiencing really slow editing speed on a page where I have multiple editors.

Please see https://json-everything.net/json-schema (source).

When pasting in text, it seems fine, but trying to manually edit the text is painfully slow.

The settings I'm using:

new()
{
    AutomaticLayout = true,
    Language = "json",
    Theme = "vs-dark",
    SelectOnLineNumbers = true,
    Scrollbar = new EditorScrollbarOptions
    {
        AlwaysConsumeMouseWheel = false
    },
    ScrollBeyondLastLine = false
}

I've tried turning these off individually with no change.

Hopefully it's just a configuration thing. Thanks for the assistance.

[serdarciplak]

Hi. I tried the same settings in the sample app in this repo and it worked without any problems. Then, I cloned your repo. As there were other blazor components too, I tried removing them one by one and looks like the ApiIndex items in the last RadzenPanelMenuItem somehow breaks it. If those ApiIndex objects use reflection (or any other long running tasks) and they update on every key up event, that is possibly the reason of your problem.

As the problem is not about BlazorMonaco or Monaco Editor, I'll close this issue.

[gregsdennis]

Thanks for the research @serdarciplak! I'll have a go at those components.

[gregsdennis]

Turns out the issue was in handling the KeyUp event at all. I've noticed a significant performance drop when specifying a handler for the event, even if the handler is empty.

Interestingly, the issue does reduce significantly when removing the radzen controls, so I expect there's a strange interaction between them. The radzen components are non-reactive to the key-up, so I don't know why it affects performance.

[serdarciplak]

It’s not about KeyUp event. Any event you subscribe will cause the same problem.

And it’s not about Radzen controls too. If you leave all Radzen controls there and only remove the ApiIndex components, the issue is resolved. As I said before, you need to have a look at how ApiIndex components work.

[gregsdennis]

I wrote the ApiIndex component. The code is in that repo. It consists of only a RadzenMenuPanelItem and an ApiNamespace (also in the repo), which is a RadzenMenuPanelItem with a number of nested ApiNamespaces.

If there's a better way to do this, I'm open to it.

[serdarciplak]

I'm not sure, but most possibly, things in the ApiIndex or ApiNamespace components are triggered repeatedly in some cases and that causes the problem. Just put some breakpoints in them to understand and as their output shouldn't change at runtime, try to cache them.