我们的应用程序使用无限滚动来导航大量异构项目列表。有一些皱纹：
- 对于我们的用户来说，通常有10,000个项目的列表，并且需要滚动3k +。
- 这些都是丰富的项目，因此在浏览器性能变得无法接受之前，我们只能在DOM中包含几百个。
- 这些物品的高度各不相同。
- 这些项目可能包含图像，我们允许用户跳转到特定日期。这很棘手，因为用户可以跳到列表中需要在视口上方加载图像的位置，这会在加载时将内容下推。无法处理意味着用户可能会跳转到某个日期，但是随后又被转到了更早的日期。
已知的，不完整的解决方案：
（react-infinite-scroll）-这只是一个简单的“当我们触底时加载更多”组件。它不会删除任何DOM，因此它将死于数千个项目。
（带有React的滚动位置）-显示在顶部插入或底部插入（而不是同时插入）时如何存储和恢复滚动位置。
我不是在寻找完整解决方案的代码（尽管那会很棒。）相反，我正在寻找“ React Way”来为这种情况建模。滚动位置是否处于状态？我应该跟踪什么状态才能保持在列表中的位置？我需要保持什么状态，以便在滚动到渲染内容的底部或顶部附近时触发新的渲染？
看看http://adazzle.github.io/react-data-grid/index.html# 这看起来像是功能强大且性能卓越的datagrid，具有类似Excel的功能以及具有以下特性的延迟加载/优化渲染（用于数百万行）：丰富的编辑功能（获得MIT许可）。尚未在我们的项目中尝试过，但很快就会这样做。
搜索此类内容的好资源也是http://react.rocks/。 在这种情况下，标签搜索很有用：http : //react.rocks/tag/InfiniteScroll