search

mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.54k stars 1.32k forks source link

[data grid] Potential Memory Leak in the DataGrid component #15459

Open marcusguay opened 18 hours ago

marcusguay commented 18 hours ago

Steps to reproduce

Steps:

  1. Open this link to live example: https://codesandbox.io/p/devbox/vite-react-forked-tgv2tj?workspaceId=ab98d85e-d21a-46f5-ab70-5be2562476c1
  2. Navigate to the collections page
  3. Navigate back
  4. Take heap snapshots
  5. Repeat this a bunch of times

Current behavior

In the Memory tab in the Chrome dev tools, taking snapshots (Both heap shots or detached nodes) after navigating to and back from both pages, detached nodes start accumulating.

Expected behavior

Nodes should not become detached when navigating to and away from the page and should eventually be cleared from memory.

Context

I am trying to use the component to display data, however, the detached nodes start to accumulate without being collected by the garbage collector.

Your environment

npx @mui/envinfo ``` System: OS: Linux 6.1 Debian GNU/Linux 12 (bookworm) 12 (bookworm) Binaries: Node: 20.9.0 - /usr/local/bin/node npm: 9.8.1 - /usr/local/bin/npm pnpm: 8.10.2 - /usr/local/share/npm-global/bin/pnpm Browsers: Chrome: Not Found npmPackages: @emotion/react: ^11.13.3 => 11.13.3 @emotion/styled: ^11.13.0 => 11.13.0 @mui/core-downloads-tracker: 6.1.7 @mui/material: ^6.1.7 => 6.1.7 @mui/private-theming: 6.1.7 @mui/styled-engine: 6.1.7 @mui/styled-engine-sc: ^6.1.7 => 6.1.7 @mui/system: 6.1.7 @mui/types: 7.2.19 @mui/utils: 6.1.7 @mui/x-data-grid: ^7.22.2 => 7.22.2 @mui/x-internals: 7.21.0 @types/react: 18.3.12 react: ^18.3.1 => 18.3.1 react-dom: ^18.3.1 => 18.3.1 styled-components: ^6.1.13 => 6.1.13 


**Search keywords**: memory leak Datagrid
michelengelen commented 4 hours ago

@romgrk could you have a look at this one, please? 🙏🏼