通过 JSON 文件创建大型客户端 Javascript 对象数组的替代方法？答案

【问题标题】：Alternative to creating large client side Javascript array of objects via JSON file?通过 JSON 文件创建大型客户端 Javascript 对象数组的替代方法？
【发布时间】：2013-07-04 18:26:34
【问题描述】：

我有一个网站，其中包含显示员工活动记录的图表。有数据层（即：地区 -> 州 -> 办公室 -> 经理 -> 员工 -> 活动记录），每次单击图表时，它都会向下钻取一个级别以显示更具体的信息。最高级别（区域）需要我将 ~1000 个对象加载到一个数组中，最低级别是 ~500,000 个对象。我正在使用 JSON 格式的文本文件填充图表：

$.ajax({url:'data/jsondata.txt', dataType: 'json',
        success: function (data) {
        largeArray = data.employeeRecords;
}

是否有其他方法可以在不影响响应时间/性能的情况下使用？我陷入了必须预加载所有数据客户端的想法，否则如果我需要在用户点击时获取它，就会有延迟。如果有人可以向我指出最佳实践，甚至可以解释什么被认为是“太多”的客户端数据，我将不胜感激。

仅供参考，我只能使用旧的 Web 服务器，如果我想在服务器端做任何事情，我将被限制在经典的 ASP 上，否则它必须是客户端。谢谢！

【问题讨论】：

单个记录的外观/包含什么？一个字段，很多字段，嵌套数组？数据类型？
姓名、地区、办公室、经理、员工编号、活动类型、开始时间戳、结束时间戳。这是一个记录的例子——里面没有嵌套任何东西。经理要求每个人在该级别的详细信息（每天数百次活动，数百名员工）

标签： javascript json object optimization graph

【解决方案1】：

如果您的服务器响应迅速

在这种情况下，您可能只需在用户点击时按需加载数据。服务器很快，所以为什么要努力变得更聪明而没有收获。

如果服务器速度很快，但不够快，那么您可以在绘制第一个关卡时预加载下一个关卡。例如，如果您刚刚在“办公室”级别渲染了图表，那么在用户仍在对屏幕更新做出反应时，静默地预加载“经理”下一层数据。

如果服务器太慢而无法按需提供数据

在这种情况下，您可能需要准确地建模慢的地方并解决这个问题。这里有几件事情在起作用，你的问题并没有准确地说出来。

服务器查询数据库是否慢，如果是，请修复它。您几乎无法在客户端解决这个问题。
服务器打包传输是否慢？更难修复，服务器够大吗？
网络传输慢？嗯，需要发送更少的数据或让用户使用更快的带宽。
浏览器解压时间很慢？（即在您的脚本绘制图表之前延迟解码数据）。更改打包数据的方式，或发送更少的数据，例如块。

浏览器可以处理 500,000 个对象吗？您应该能够只监视您正在使用的浏览器的内存，并且对此有选项是/否。将真正依赖或针对用户的浏览器/硬件。

您可能想看看这个问题What is the most efficient way of sending data for a very large playlist over http?，因为它显示了另一种发送和处理数据的方法，我发现对于上面的第 4 步来说这种方法要快得多。当然，如果有 500k 个对象，您将无法再使用 localStorage，但我一直在尝试下载数百万个数组元素，并且运行正常。（仍在 WIP 中）我不使用 jquery，所以也不知道这有多有用。

最佳实践？抱歉，这部分问题无能为力。

【讨论】：