[data grid] Table columns not auto-resizing correctly unless forced re-render / useEffect or setTimeout runs

[Tholkappiar]

I’m facing an issue with DataGridPremium column auto-sizing, where columns that are initially outside the viewport are not auto-resized correctly unless I force a re-render (e.g., via a useEffect state update or sometimes setTimeout)

PS: i will get the response from the server and then render that in the table

When using autosizeColumns (via apiRef) or autosizeOptions, the columns that are not visible in the initial viewport get truncated and are not auto-sized as expected.

However, if I add a useEffect that updates state once after mount (even if the state value is unused), the issue disappears and all columns auto-resize correctly.

StackBlitz demo:
👉 https://stackblitz.com/edit/vitejs-vite-86smdckd?file=src%2FTable.jsx

Expected Behavior

• All columns (including those outside the viewport) should auto-resize correctly
• No need for a forced re-render or dummy useEffect or setTimeout