现代浏览器提供了多种客户端存储方案，各有适用场景。
| 对比项 | IndexedDB | LocalStorage |
|---|---|---|
| 存储容量 | 250MB+ (浏览器决定) | 5-10MB |
| 数据类型 | 结构化对象 | 仅字符串 |
| 同步/异步 | 异步 | 同步 |
| 索引支持 | 是 | 否 |
| 事务支持 | 是 | 否 |
| 查询能力 | 强大（索引、范围） | 无 |
| 适用场景 | 大量结构化数据 | 简单键值对 |
| 性能（大量数据） | 好 | 差 |
| 离线可用 | 是 | 是 |
| 对比项 | IndexedDB | SessionStorage |
|---|---|---|
| 生命周期 | 持久化 | 页面会话 |
| 跨标签页 | 是 | 否 |
| 容量 | 大 | 5-10MB |
| 数据类型 | 结构化对象 | 字符串 |
| 适用场景 | 长期数据存储 | 临时会话数据 |
| 对比项 | IndexedDB | Cache API |
|---|---|---|
| 设计目的 | 结构化数据 | HTTP 缓存 |
| 存储内容 | JS 对象 | Request/Response |
| 索引查询 | 支持 | 不支持 |
| 与 Service Worker | 可配合 | 原生集成 |
| 适用场景 | 应用数据 | 静态资源缓存 |
| 对比项 | IndexedDB | OPFS |
|---|---|---|
| 数据模型 | 记录/对象 | 文件/目录 |
| 随机访问 | 通过键 | 通过文件句柄 |
| 流式处理 | 不支持 | 支持 |
| 大文件 | 不适合 | 适合 |
| 结构化查询 | 强大 | 不支持 |
需要存储什么数据？
├── 简单配置/令牌
│ └── LocalStorage / SessionStorage
├── HTTP 响应缓存
│ └── Cache API
├── 大文件（视频/图片）
│ └── OPFS / File System Access API
├── 结构化应用数据
│ ├── 数据量 < 5MB
│ │ └── LocalStorage (JSON)
│ └── 数据量 > 5MB 或需要索引
│ └── IndexedDB
└── 混合需求
└── IndexedDB + Cache API 组合使用
本章对比了浏览器存储技术：
继续阅读 第十四部分：故障排除与调试。