layerchart icon indicating copy to clipboard operation
layerchart copied to clipboard
verified publisher icon techniq

Investigate potential memory leak

Open techniq opened this issue 6 months ago • 2 comments

  • Open streaming example
  • Click Load more on page
  • Open DevTools
  • Take heap snapshot on Memory tab
  • Click Load more on page
  • Take heap snapshot on Memory tab
  • Click on Snapshot 2 and filter Objects retained by detached DOM nodes
  • See also Objects allocated between Snapshot 1 and Snapshot 2

Image

Also, open Performance monitor and click Start on page to stream data and watch the fluctuations on JS heap size (with GC kicking in, but still a general upward trend). More notable, see the large / consistent increase in DOM nodes .

Image

See discussion

Investigated streaming performance a few weeks ago when using Canvas and substantially improved the issue, but wasn't able to 100% resolve the issue.

techniq avatar Jul 02 '25 14:07 techniq

Narrowed it down to something in Axis (Text, etc).

https://github.com/user-attachments/assets/589415dc-b4ae-49ba-ad06-cbbb4cc39714

techniq avatar Jul 03 '25 04:07 techniq

Reduced by over 90% with a high frequency update over 30s via #586 (released as 2.0.0-next.28).

This also greatly improves the update speed of time axis:

Before

https://github.com/user-attachments/assets/3c9fdb0b-587a-4c73-9585-aa4746853db2

After

https://github.com/user-attachments/assets/78991a31-f8fe-41f0-990d-2988b00cd90a

Still trying to track down the remaining leak (it's within Axis) but not making much sense to be at the moment.

techniq avatar Jul 03 '25 13:07 techniq