javascript - AJAX 使浏览器崩溃(200MB 响应)

Question

我有一个 API 可以通过连接返回整个数据库的对象列表。 (是的，一切都需要，这是一份很酷的报告:))

当我没有1个表时，数据是150MB，一切都OK。我现在遇到一个问题，我添加了一个大表 (50MB)，它使浏览器崩溃。

有没有办法在不使浏览器崩溃的情况下获得 200MB 的响应？

Answer 1

假设您确实需要浏览器中的所有这些数据，并且您愿意接受使用大型数据集对性能的影响...

这里的问题可能不在于数据本身的原始大小，而在于数据的格式。

如果您将 200MB 数据转储到 JSON 中，并希望您的浏览器对其进行解析并在内存中创建一个包含所有这些数据的对象，那么您将有一段糟糕的时光。 XML 也是如此。此外，我怀疑对于 200MB 的下载，您希望在加载数据时向用户显示一些进度……甚至可能在加载数据时显示一些数据。所有这些的解决方案是对数据进行分块。我猜你的数据主要是基于数组的。逐 block 加载该数组的元素。从一次 10k 条记录开始，看看它能帮到你什么。

您仍然可以使用 AJAX 来获取数据，因为您已经解决了解析响应的问题。但是，您也可以考虑使用网络套接字来减少一些请求开销。 (或者，尽可能使用 HTTP/2。)

我还应该指出，有可用于 JSON 和 XML 的流式解析器。这要求您能够获取该数据流(网络套接字使这变得容易)，并且取决于您的数据格式是否对您有用。

如果在分块数据后您仍然遇到崩溃，那么是时候熟悉开发人员工具并分析您的内存使用情况了。您可以在网页中加载的内容存在限制，这因浏览器和浏览器(以及系统与系统，尤其是在移动设备上)而异。

2020 年更新: Line-delimited (ND-JSON)是进行这种分块的常用方法。您可以在客户端流式传输结果并在进行时进行解析。不需要流解析器，您只需要一个转换流来处理这些行。