React Virtualized for Documents

React Struggles with super-long lists, like we have with feeds, large documents and documents with long query blocks. React has to go through the render and commit-to-DOM phases for every item in the list before the first one will be visible for the user. But we want to prioritize rendering the items in a long list that are actually visible to the user.

React Virtualized handles this, monitoring the user's scroll position and screen size to send batched portions of the long list to render in React.

With documents this will be somewhat difficult because of the editor

Note: we have used this technique for a while for rendering lists, but we should do it for documents as well. Also we could consider @tanstack/virtual as an alternative

Do you like what you are reading? Subscribe to receive updates.

Unsubscribe anytime