perf(elements): improve performance of real-time reporting

[xandervedder]

Instead of recalculating every time an event comes through, only recalculate it during certain intervals. By using the debounceTime function from rxjs we can tell rxjs to ignore certain events during a certain time period.

before: https://profiler.firefox.com/public/m0578rpmtf3xxvq31wfwd5927jbsdgmtcgs3ekr/calltree/?globalTrackOrder=0w2&implementation=js&thread=2&v=9

after: https://profiler.firefox.com/public/fftmqbk76rwn26g2p9wwjzwwr6ef7b6gqh052g8/calltree/?globalTrackOrder=0w3&implementation=js&thread=5&v=9

closes #2496

[nicojs]

Why don't we implement fine-grained reactivity instead? Might be fast enough to handle big workloads without the need for throttling

[xandervedder]

Right now, the function that costs the most performance is recalculating the metrics since that is done recursively for every item in the model (which could be a large model).

I remember you told me we could mark the mutants (?) as dirty so we would only have to update the marked ones. Not sure if that would improve performance and also not sure when we would update the marked ones.

This might not be the best solution, but it definitely improves performance 😃.

[rouke-broersma]

Why don't we implement fine-grained reactivity instead? Might be fast enough to handle big workloads without the need for throttling

That sounds like a good future improvement, but at this stage I think that might be a bit too much out of scope considering the other work that still needs to be done (real time report support in the dashboard for example). Could you accept this throttling solution in the intermediate time?

[hugo-vrijswijk]

FYI the conventional commit type should be perf: https://github.com/angular/angular/blob/main/CONTRIBUTING.md#type

[xandervedder]

There seems to be a test on windows that is timing out, investigating that right now...

I am not able to reproduce it locally...