直接用 JSON.parse 解析几百 MB 的 JSON 文件会阻塞主线程、爆内存、导致页面卡死甚至崩溃;异步生成器配合流式读取和分块解析可实现边读边解、按需消费,避免全量加载和 UI 锁定。

直接用 JSON.parse 解析几百 MB 的 JSON 文件,会阻塞主线程、爆内存、导致页面卡死甚至崩溃。异步生成器(async function*)配合流式读取和分块解析,能真正实现“边读边解、按需消费”,把大 JSON 拆成小块逐步处理,不占满内存,也不锁住 UI。
核心思路:不加载全量字符串,改用可读流 + 分块解析
浏览器中无法直接流式解析 JSON 字符串,但可以借助 ReadableStream 和自定义解析逻辑,将 JSON 数据按结构边界(如数组项)切片。关键不是“解析整个 JSON”,而是识别并逐个 yield 解析好的子对象。
- 用
fetch()获取响应体的response.body(返回ReadableStream) - 用
TextDecoderStream或手动分块读取字节流,避免一次性转成巨型字符串 - 在异步生成器中维护一个 JSON 解析上下文(如括号计数、引号状态),识别每个完整 JSON 值的起止位置
- 每识别出一个合法 JSON 值(例如数组里的一个对象),就
yield它的解析结果(已调用JSON.parse的小对象)
简易可行的异步生成器示例(处理 JSON 数组)
假设服务端返回的是标准 JSON 数组格式:[{"id":1,...},{"id":2,...},...]。这是最易分块的场景:
await new Promise(...)
- 错误恢复:遇到非法 JSON 不 throw,而是跳过并记录日志,继续后续解析
-
资源清理:在生成器末尾或异常时调用
reader.cancel(),防止流泄漏 -
类型预检:先检查响应头
Content-Type: application/json,避免误处理二进制 -
背压控制:如果消费速度慢于生产,可在生成器内部加
if (pendingCount > 10) await sleep(1)暂停读取 - 替代方案参考:对更复杂 JSON(嵌套深、非数组根节点),可集成 stream-json 这类专业流式解析库,它提供事件驱动的 parser、matcher、streamer 组合能力
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











