Chrome renderer freeze when TanStack row model gates a Suspense child
Nadie ha tomado este issue todavía.
Evaluación
- Dificultad
- 4/5
- Tiempo estimado
- 3-5 días
- Aptitud para principiantes
- 35/100
- Tipo de issue
- Error
- Claridad
- Necesita aclaración
- Estado de actividad
- Tranquilo
- Stack tecnológico
- react, typescript, vite
- Área
- frontend
Línea de trabajo
Clone la reproducción independiente enlazada, ejecute pnpm install, pnpm check y pnpm preview:repro, y luego reproduzca el congelamiento en Chrome con el Synchronous active row button. Empiece con el ejemplo reducido de App y compare el comportamiento con y sin table.getRowModel().rows.length; se considera completado cuando se haya establecido si el problema pertenece a TanStack Table o a la interacción entre React y el navegador, y se haya documentado una corrección confirmada o una transferencia con el alcance delimitado.
Escrito por el modelo de indexación a partir del texto del issue.
Descripción
Summary
In a Vite production preview, Chrome can freeze after a real browser click when all of the following happen in the same render path:
- A synchronous React state update switches TanStack Table from empty data to a fresh one-row
dataarray. - The component reads
table.getRowModel().rows.length. - That row-model read gates mounting a child inside
Suspense. - The child suspends by throwing a timer-backed promise.
The repro is standalone and uses only local React state/data.
Reproduction
Standalone repro:
https://github.com/HaukeSchnau/trusted-click-table-suspense-freeze-repro
Repro commit used while filing this issue:
https://github.com/HaukeSchnau/trusted-click-table-suspense-freeze-repro/tree/67c0ea8
git clone https://github.com/HaukeSchnau/trusted-click-table-suspense-freeze-repro.git
cd trusted-click-table-suspense-freeze-repro
pnpm install
pnpm check
pnpm preview:repro
Then open http://127.0.0.1:4174/ in Chrome and click Synchronous active row.
The repro command uses Vite production preview. I have not characterized Vite dev mode.
Expected behavior
The click completes, the Suspense fallback handles the thrown promise, and the page remains responsive.
Actual behavior
The Chrome tab freezes during the click. Reloading or closing the tab is required to recover.
Environment
- React
19.2.3 react-dom19.2.3@tanstack/react-table8.21.3- Vite
7.3.0 - TypeScript
5.9.3 - Node
v24.11.1 - pnpm
10.25.0 - Chrome
147.0.0.0fromnavigator.userAgent - macOS
26.4.1(25E253)
I have only confirmed the freeze in Chrome. Firefox and Safari are untested.
Reduced trigger
const columns: [] = [];
const coreRowModel = getCoreRowModel();
let resolved = false;
let promise: Promise<void> | undefined;
function Suspender() {
if (!resolved) {
promise ??= new Promise((resolve) => {
window.setTimeout(() => {
resolved = true;
resolve();
});
});
throw promise;
}
return null;
}
function App() {
const [active, setActive] = useState(false);
const table = useReactTable({
data: active ? [null] : [],
columns,
getCoreRowModel: coreRowModel,
});
return (
<>
{table.getRowModel().rows.length ? (
<Suspense fallback={null}>
<Suspender />
</Suspense>
) : null}
<button id="sync-active" onClick={() => setActive(true)}>
Synchronous active row
</button>
</>
);
}
Isolation notes
The repro does not use TanStack Router, TanStack Query, React Compiler, Vite React plugin, APIs, auth, or production app code.
This may ultimately be a React Suspense or browser interaction. I’m filing here first because the smallest library-specific condition I’ve isolated is the TanStack Table row-model read over fresh data; the reduced app becomes responsive when that row-model read is removed.
- Lenguaje dominante
- TypeScript
- Estrellas
- 28.4k
- Forks
- 3.6k
- Merge medio
- 1 d 1 h
- PR fusionados (30 d)
- 7
Guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Más de TanStack/table
-
Dificultad 1/5 Menos de una hora Aptitud para principiantes 78/100
-
Dificultad 5/5 Más de una semana Aptitud para principiantes 35/100
-
Dificultad 3/5 1-2 días Aptitud para principiantes 78/100
-
Dificultad 5/5 Más de una semana Aptitud para principiantes 35/100
-
Dificultad 3/5 1-2 días Aptitud para principiantes 55/100
Todos los issues de TanStack/table
Issues similares
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 84/100
bcgov/bc-wallet-mobile#4761 · 1 comentario ·
-
external-issue to-triage
Dificultad 2/5 1-3 horas Aptitud para principiantes 88/100
-
area-deployment area-integrations triage:bot-seen
Dificultad 2/5 Medio día Aptitud para principiantes 86/100
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 82/100
-
refactor
Dificultad 2/5 1-3 horas Aptitud para principiantes 84/100