无限 scrolling/data 分页和不同步的页面结果

Question

我即将在 Web 应用程序中开发项目的无限滚动（这只是分页项目的特定 UX），但我有点困惑如何解决在一个项目中添加新项目的问题用户 scrolls/pages 通过项目。我们如何处理这些未同步的数据？

假设当我打开我的页面数据库时有 100 个项目。

用户 1 导航到请求前 10 个项目并显示它们的页面
用户 1 然后开始滚动并到达页面请求下 10 个项目的点
用户 2 添加了一个新项目，因此数据库现在有 101 个项目
用户 1 滚动请求下 10 个项目。

后端应该发生什么？

如果用户向下滚动，我们可以从最后一个 ID 中请求 10 个项目
如果用户向上滚动，我们会请求前 10 项，但现在顶部有另一项？

这个是怎么解决的？甚至在 Stackexchange 网站上，当用户浏览问题页面时，内容被分页和流缓存发生变化？

Should this question be asked on programmers maybe? I'm not sure...

Answer 1

通过提供

传统上不进行分页最容易解决这个问题

页面索引和
页面大小，

而是提供

最后显示的记录 ID 和
页面大小

这称为键集分页或键查找方法分页。两者通常都需要额外的参数，如排序和过滤，但这两种技术相似，因此与这个答案无关。

这可以防止在将新项目添加到列表顶部时返回无效页面，但它也有一个缺点，即无法让您跳转页面（即在我们查找时获取第 10 页）第 5 页）。但这就是为什么它被用于特定场景，例如无限滚动，在这种情况下，这个问题不存在，甚至不需要。

查看有关 key seek 方法的性能比较和大量解释:
http://use-the-index-luke.com/sql/partial-results/fetch-next-page

所以基本上我们想要做的是沿着这些思路（假设我们按时间顺序倒序排列并假设 CreateDate 具有如此高的精度以至于它被认为是唯一的）：

with LastRecord
as (
    select CreatedDate
    from Records
    where Id = @LastRecordId
)
select r.*
from Records r, LastRecord l
where r.CreatedDate < l.CreatedDate
offset 0 rows
fetch first @PageSize rows only;

无限 scrolling/data 分页和不同步的页面结果

Infinite scrolling/data paging and out-of-sync page results

paging

infinite-scroll