T
TanStack6mo ago
stormy-gold

SSR streaming rendering broken with HTML greater than a certain size

Here's the situation: I've got a loader that returns a lot of data which is put into a shadcn/ui table for display. The rendered HTML is from SSR streaming is broken when I return either too many rows OR have too much markup. This then creates a hydration error. 1. I can render 151 rows worth of data. However, as soon as I take 152 rows or more, I get a hydration error and the HTML that's SSRed is broken. 2. I can render 152+ rows without error if I remove the shadcn/ui table elements (which produce quite verbose html) and use plain tables instead. 3. I can resolve the issue by using defaultRenderHandler instead of defaultStreamHandler in ssr.tsx 4. Two example of broken HTML shipped to the browser by SSR are attached. One is from rendering 152 rows, the other is from rendering all 435 rows in the db.
No description
No description
No description
2 Replies
stormy-gold
stormy-goldOP6mo ago
No description
stormy-gold
stormy-goldOP6mo ago
Update: This appears to be an issue only when using bunx --bun vinxi dev and not bunx vinxi dev

Did you find this page helpful?