bug(mat-table): memory leak in mat-table

[lahlers]

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

17.3.6

Description

Whenever elements in a mat-table stop becoming visible (for example due to page change with a paginator) the DOM elements stay in memory as detached elements. This only resolves with a page reload.

When checking the retainer on detached table elements it is the StickyStyler.

The behaviour is present since at least version 18.2.8 possibly earlier.
In version 17.3.6 it seems to be working correctly.

Reproduction

StackBlitz link: Stack Blitz from https://material.angular.io/components/table/overview#pagination example
Steps to reproduce:

1. Change pages via the paginator a few times
2. Check detached elements

Expected Behavior

DOM elements of the table that are no longer shown should not be retained as detached elements but properly cleaned up.

Actual Behavior

All DOM elements of the table that are no longer visible stay in memory as detached elements until the page is reloaded.

Environment

• Angular: 19.1.3, 18.2.8
• CDK/Material: 19.1.3, 18.2.8
• Browser(s): Firefox, Chrome, Edge
• Operating System (e.g. Windows, macOS, Ubuntu): Windows, macOs, manjaro Linux

[vhschlenker]

Using Google Chrome Version 132.0.6834.160 (arm64) on macOS, I can confirm and recreated the problem by just clicking thought the pages in the paginated table on the material components page.
Even after waiting a few minutes and manually calling the GC through the "Performance", the number of detached elements stays the same.
The screenshot shows the initial state after page load and the increasing number of detached elements.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}