分页的动机
在我看来有两种:
- 返回的file比较大但browser可以接受,在线展示的话阅读起来很难受,也不方便跳转。
- 返回的文件太大,browser接收会很困难,甚至崩溃。
分页的方法
对于第一种分页动机,我们就可以直接在前端完成。
// store the seperate pages of csv.
var csv_parts = new Array();
// record current number of page
var page = 1;
// devide the page
if (csv.length > 1500)
{
// calculate the number of pages
var groups = csv.length/1500 +1;
for (var i = 0;i < groups - 1; i++)
{
csv_parts[i] = csv.slice(i*1500,(i+1)*1500);
}
csv_parts[groups - 1] = csv.slice((groups - 1)*1500);
// call the transform function
csvTotable(csv_parts[0]);
}
else
{
// call the transform function
csvTotable(csv);
}
function nextPage()
{
if (page < csv_parts.length)
{
// call the transform function
csvTotable(csv_parts[page]);
document.getElementById("page").innerHTML = "Page " + (page + 1);
page += 1;
}
else
{
window.alert("This is the last page");
}
}
function lastPage()
{
if (page > 1)
{
page -= 1;
// call the transform function
csvTotable(csv_parts[page - 1]);
document.getElementById("page").innerHTML = "Page " + page;
}
else
{
window.alert("This is the first page");
}
}
有人说,前端分页是一个笑话,为什么呢?后面会解释。
对于第二种分页动机,这个就要后端来实现,为什么呢?因为传输的文件太大,前端都无法接收,何来处理。
原理上讲,后端提供API,前端每一次只请求一个page,并得到一个page。
回到上面的那个问题,既然后端都可以返回固定大小的page,那前端就不需要分页的功能了,以后任何file的分页都可以后台处理,这就完全不用考虑client端的环境和效率了。
其实前端分页还是有一点用处的,比如file在合理大小的情况下,
- 前端只需要一次下载就可以得到所有资源。在网络不持续的情况下,很有用。(读小说)
- 针对不同的device,前端可以本地调整,直到适合为止。