SSR initially only loads 4 rows #3632
Unanswered
UncleSamSwiss
asked this question in
Q&A
Replies: 0 comments
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
We are using react-data-grid in a Remix application.
We have virtualization enabled and we want to keep it enabled as it is important to our use case.
When the initial HTML is rendered on the server side, it only renders the first 4 rows (header + 3 rows of data). This makes sense, when looking at the code: https://github.com/adazzle/react-data-grid/blob/main/src/hooks/useViewportRows.ts#L78-L84
Specifically
const rowVisibleEndIdx = findRowIdx(scrollTop + clientHeight);
Since
clientHeight
is 0 in SSR, we end up with 0 and add anoverscanThreshold
of 4, resulting in 4 rows.How do others handle this? Do you just accept that only 4 rows are shown before JavaScript is loaded and the DOM is rehydrated? Do you have a way to "fake" the clientHeight so for example we have at least the first (for example) 100 rows rendered?
Beta Was this translation helpful? Give feedback.
All reactions