超过多少条数据前端应该开始实现分页？

Question

如题，1000条数据以内前端可以一次性获取数据，还是1w条以内都不用做分页？

以普通的16g内存的计算机为例。

感谢。

Answer 1

一般一页100条都已经不少了, 1000条建议还是分一下, 一次渲染这么多还是挺费性能的, 或者使用虚拟列表进行渲染

也不建议一次返回这么多, 网络环境好还行, 差一些需要等待的时间太长了, 影响用户体验

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 2

如非必要就默认是后端分页。 前端分页其实只是为了实现一些UI效果罢了。
或者说是遇到性能瓶颈了在不提升服务器配置的情况下去做前端分页来减轻服务端的负担。

基本上近千条的数据渲染，如果没有做好优化页面就会开始明显出现卡顿了。如果一次性返回过万条数据，比如说又有连表查询啥的，基本也是需要等待响应很久的。

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 3

首先，分页最好还是后端来处理的吧。
其次，通常情况下每页最多也就是200或者500。
这种通常只是展示类的数据吧，数据很大的话，可能只会提供查询部分数据。数据量大直接提供导出Excel数据。

以普通的16g内存的计算机为例。 16G内存又不全是给浏览器使用的，再说每条数据大小也不一定。

---

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 4

以一屏为例，超过一屏就分页

所以这里一般是 10、20、50 让用户可选。

结果不可能是以量取胜，你用搜索引擎的时候，看过第二页的内容吗？

如其返回给用户大量无效的内容，不如给用户一些筛选条件，或者让用户主动收藏一些内容。

举个例子，有些人会屏蔽某些网站的内容，如果你返回了 10000 条中只有 10 条是用户关心的，这不是白花钱吗

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 5

如果一条数据占 1K （已经很大了），那么 1W 条数据占 10M，这就算是对于 2G 内存的计算机来说，也是小得可怜的数据量。所以你要一次性拉 1W 条到内存都不是什么问题。真正的问题在于

1. 10M 数据的传输时间
2. 渲染/呈现这 1W 条数据的时间
3. 为了渲染这 1W 条数据占用的显存和 DOM 等占用的内存

同时，从用户体验的角度来说，一次性给 1W 条，用户又看去浏览几条呢？

所以现在一般做法是，按 10以内（每屏数据）、20~50（一般会人眼查找的数据量）、50~200（某些特殊情况下人眼查找的数量）来划分几个阶梯供用户选择，根据系统数据的特点，一般会默认在 20 以内。

当然现代人越来越习惯使用搜索功能，所以如果能把搜索功能做好，翻页已经不是刚需了。真想全数据查找，但应用本身又不能提从灵活的查找方式时，不如导个电子表格出来做筛选。

Answer 6

最好是分页，一次性获取 1000 或 10000 数据进行渲染实际上是没有必要的，分页又分为前端分页和后端分页，通常情况下，肯定是后端分页合理些，因为在请求上会更快，而前端分页的话，其实就是为了防止一次性渲染太多的 DOM 避免页面性能卡顿，因此，还是根据场景来划分就好。

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。