javascript - 处理大型数据集的图形和显示的最佳方法

Question

我们的网站为我们的客户提供各种数据服务；其中之一是仪表数据。有些仪表每 15 分钟记录一次信息，有些则每分钟记录一次。这些数据被发送到我们的 SQL 数据库。

所有这些数据都通过图表（通过 PHP 和 JPGraphs 生成的服务器端）显示，每个单独的日志条目在可折叠表（jquery 1.10.2）中显示为一行。

当客户想要查看数据时，他们会选择一个日期范围以及他们想要查看的量规。如果他们想查看每分钟记录的仪表的最后 3 天，那么它会很快加载。如果他们想查看其中的 2 个，则加载大约需要 15-30 秒。当他们想要查看一个月的数据时，真正的问题就出现了。尤其是超过 1 个规格。这可能需要 15-20 分钟才能加载，并且浏览器会反复询问我们是否要停止脚本填充可折叠表格行（jquery）。

显然这是一个问题，因为客户需要相对快速的响应（最多 1-5 分钟）。理想情况下，我们还希望能够一次提取几个月的仪表数据。我们现在能做到这一点的唯一方法是一次提取 2 周的数据并手动编译总数。

供参考：如果我想为我们的 2 个每分钟记录一次的仪表提取一个月的数据，那么将通过 jQuery 将 86,400 行添加到可折叠表中。该页面大约需要。加载 5 分钟，在此期间浏览器非常慢。

我的问题是：使用基于 PHP 的服务器（Symfony 1.4 框架）和 javascript 提取/绘制/填充数据的最佳方式是什么？

我们是否应该考虑升级我们分配的处理能力/RAM（我们由 GoDaddy 托管）？有没有比 jquery 更快的方法来填充可折叠文件？我们所有的计算都是在服务器端完成的。我们应该只提取原始数据并让客户端进行数据处理吗？我们应该在客户端和服务器之间拆分数据处理吗？

这是网页的屏幕截图。它被裁剪，以便不显示更多对客户敏感的信息：

Answer 1

回应我的评论。

由于您只需要服务器端的整个数据集（您在服务器上创建图表），这意味着您实际上不需要将整个数据集发送到客户端。

而是将一小部分发送给客户。假设前 200 个结果。然后，您可以继续将结果集的其余部分缓存到 JSON 文件中（精简数据库，无论您真正想要什么）。然后创建一个界面，用户可以在其中请求更多数据。无限滚动很好，但有其自身的问题。也许只是一个显示加载更多数据的按钮。正如人们所说的那样，一次在一个表中拥有超过几百个数据点是很疯狂的，因为人们无论如何都不会看它。然后，当他们点击按钮获取更多数据时，您向服务器发送一个 AJAX 请求，其中包含您想要的数据的正确参数。

例如，当他们第一次单击 getMoreData() 时，您想要获取接下来的 200 个数据点。所以你发送 getMoreData(start=200, length=200)。您的服务器接收 AJAX 请求并在 JSON 文件或 lite 数据库中找到正确的数据，无论您缓存了结果。并且用户可以继续请求更多数据（确保更新开始参数），而您只返回一个小子集。用户甚至没有意识到他们面前没有整个数据集，因为看起来他们确实有。

对此比较复杂的是排序和搜索。如果你想实现这些，那么你需要确保你去服务器端并通过缓存的结果进行排序/搜索。

所以基本上你有一个系统，你可以在服务器端创建整个图表，这不应该花很长时间。需要很长时间的是将整个数据集加载到客户端。所以你把它分成小块。您甚至可以使用此方法轻松创建分页等。