如何对 Blazor 组件进行性能测试？

Question

Is there a way to benchmark individual components performance?

For "normal code" you'd use something like benchmark .NET but I'm not sure that this is an accurate representation of a components performance when running inside an app, maybe it is for a server app and not for a WASM one?

I'd like to find a way to test performance of the base components in our library to avoid regressions and make optimisations as needed.

Has anyone done anything like this or able to point me in the right direction?

Answer 1

About two years ago, I bought a used PC for ten dollars. It is very slow, and sometimes it takes 5 minutes to run a Blazor Server App.

One day I saw a bootstrap's carousel... I think it was Blazorise carousel component. I tested it, and then decided to built a model of my own, based on what I see. In the course of developing my carousel I've realized this, thanks to the slowness of my PC: Never create unnecessary components; or rather, use RenderFragments instead of components. I am not aware of any tools to do what you want, but I am perfectly aware that components are expensive and make your app slow, and that one must be careful with designing them. Yes, it's very tempting to use components, but other factors should be taken into consideration.

Anyhow, I ended up creating my carousel with only two components. Item slides do not have a component of their own. When I defined an Item slide as a component, I could see how it is filled with an image with slow motion (remember my slow PC). But when I moved the relevant code from a component to a plain HTML div element, the Item slide appeared already filled with an image... Even in my slow PC, human eye could not discern the transition from empty Item slide to one filled with an image.