FormidableLabs / envy

Node.js Telemetry & Network Viewer
https://envy-webui.vercel.app
MIT License
107 stars 0 forks source link

UI performance audit and fixes #191

Open kgpax opened 10 months ago

kgpax commented 10 months ago

So far, Envy has likely only be used is short bursts where the number of traces present in the list are small in number; rarely more than one or two hundred, for example.

As such the web viewer UI (and the skunkworks network viewer which preceeds it) has not be optimised for large quantities or traces, and would in all likelihood collapse under the weight of 5,000+ traces.

I raised an unrelated PR #190 which includes some tweaks to allow us to inject 1,300 traces. I had tried this with 13,000 traces and found the UI to be very unresponsive.

Therefore, we should:

One definite improvement would be to virtualise the trace list (so that only in-view traces are rendered in the DOM). Beyond that, we need to ensure that Envy can scale to this number of traces, even if just for the barmy cases where somebody in userland has it always running in the background whilst they work (or use) an application sending traces to it.

Another option to consider is that we cap the number of traces we list to a reasonable number.