Question

我处理高吞吐量问题。我的目标是至少在Chrome浏览器上显示由1M行组成的网格。

这些行是从在同一台机器上运行的python服务器动态获取的。此服务器已将整个数据集加载到内存中。客户端（浏览器）和服务器（python）之间的通信通过websocket进行。网格具有选项virtualPaging: true。

到目前为止，我已经达到了一些良好的性能，每个页面加载100行。尽管如此，在开始时加载整个1M数据集（因此没有远程读取行），显示滚动显着改善（没有＆＃34;白行＆＃34;效果）。

我希望在不将整个数据集存储在浏览器内存中的情况下实现相同的性能。

我要尝试的第一步是避免一些转换步骤。客户端从服务器接收一个数组数组，这意味着服务器上的行模型是＆＃34;位置＆＃34; （将r作为通用行，r[0]是与第一列相关的元素，r[1]与第二列相关，依此类推）。但是ag-grid的回调函数successCallback需要一个对象数组，这意味着每一行都带有与列名相关的键（给定r作为通用行，{{1} }是与第一列相关的元素，r["firstColumn"]与第二列相关，依此类推。）

考虑到键值机制所使用的大量内存浪费，第二种方法对于服务器的角度来说是完全不可行的。这导致需要对客户端收到的每个页面进行本地转换：

r["secondColumn"]

我需要的是一种传递给successCallback行的方法作为数组而不是作为避免转换部分的对象，如下所示：

client.appendCallback("message", function(message){
    message = JSON.parse(message.data);
    switch(message.command) {
        case "GetRows":
            if(message.res.code == 0) {
                var bulk = [];
                var arr = message.res.data;
                for (var i = 0, len = arr.length; i < len; i++) {
                    bulk[i] = {"par1" : arr[i][0], "par2" : arr[i][1], "par3" : arr[i][2], "par4" : arr[i][3], "par5" : arr[i][4], "par6" : arr[i][5]};
                }
                _data.successCallback(bulk);
            }
            break;
        default:
            break;
    }
},"ws");

任何帮助将不胜感激

Answer 1

这个怎么样？

修复类似100的页面大小。

由于您使用服务器端分页，因此您已经实现了自己的数据源：因此当您被要求加载数据时：加载[并转换]类似10000行并将其存储在内存中。

然后使用你自己的中间分页：每当网格要求下一行时，要么从内存中获取它们，要么获取接下来的10k行，[convert and]只返回第1个hundreth。

[convert]部分是您在询问接下来的100行时从服务器加载时进行转换操作的选择。

如果数据量很大，并且您考虑不仅在本地计算机上进行部署，那么角度（或浏览器，我真的不知道它在哪里）会透明地支持gzip压缩数据。

如何加载＆＃34; raw＆＃34;将数据划分为ag-grid

1 个答案: