如何用Vue优化处理Web端超大数据量表格卡顿问题？

本文共计3498个文字，预计阅读时间需要14分钟。

一、整体思路

1.思路来源

+ 最新的工作比较匆忙，很久没有写文章了，有一堆东西不知道如何写起来。 + 首先谈谈为什么我要开发本组件。

2.公司定位

+ 公司有一个定位系统，基本上可以说是一个定位单位。

一、整体思路

1.思路来源

最近工作比较忙好久没写文章了，有一丢丢不知道如何写起了，那就先说说我是为什么要开发本文的组件把。公司有一个定位系统，基本上来说一个定位单位一分钟或者更短就会有一个定位点，这样一天下来就会有很多定位点了，如果表格想要一下子放一天甚至三天的数据，那么数据量将会特别大（可能会到达5万条左右的数据），如果我们显示的列又比较多的话，那么表格的卡顿问题就会很明显了。我们公司web端选择的ui框架是 iview ，说实话 iview 的其他组件还行，不过表格的话在大量数据面前显得很疲软，反而我以前使用的 easyui 之类的老框架的表格性能和功能上都很好，毕竟它们已经经历了很多优化，表格这个组件的拓展性很大，想要在性能和功能上都做好十分的困难。

easyui 是个与时俱进的框架，有一次我点开它的官网发现它已经出了基于现在热门的 vue、react、angular 的ui组件。于是我这次选择去看看它基于vue的表格，于是我看到了这个组件附上连接www.jeasyui.net/demo_vue/681.html 。我发现它通过分页延迟加载的方法解决了大数据量卡断的问题，这是我基本能够理解的，不过看完之后我有一些疑问，首先如果他只渲染了一部分数据，在滚动条滚动的时候再加载数据，那么为什么滚动条为什么一直是那么长。