2. 分页(pagination)

分页的动机

在我看来有两种:

  1. 返回的file比较大但browser可以接受,在线展示的话阅读起来很难受,也不方便跳转。
  2. 返回的文件太大,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在合理大小的情况下,

  1. 前端只需要一次下载就可以得到所有资源。在网络不持续的情况下,很有用。(读小说)
  2. 针对不同的device,前端可以本地调整,直到适合为止。
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容