search

petyosi / react-virtuoso

The most powerful virtual list component for React
https://virtuoso.dev
MIT License
5.17k stars 299 forks source link

[BUG] SSR with initialItemCount set leads to unnecessary re-rendering during hydration due to initial visibleRange of [0, 0] #970

Closed FailLone closed 1 year ago

FailLone commented 1 year ago

I am experiencing an issue with SSR when initialItemCount is set.

Describe the bug During SSR, the HTML correctly renders initialItemCount number of items. However, during the hydration process on the client-side, I noticed that these items get removed and then re-rendered. This seems to be due to the initial visibleRange being set to [0, 0].

To Reproduce Steps to reproduce the behavior:

  1. Set up a new React project with SSR enabled.
  2. Create a component that uses the initialItemCount prop.
  3. Render the component on the server side and send the HTML to the client.
  4. On the client side, hydrate the app with ReactDOM.hydrate(<MyComponent />, document.getElementById('root')).

Expected behavior The initial items rendered on the server should remain in the DOM without being removed and re-rendered during the hydration process.

petyosi commented 1 year ago

https://github.com/petyosi/react-virtuoso/issues/763

petyosi commented 1 year ago

@FailLone - This should be fixed in v4.5.1. Give it a try and let me know how it works for you.