indexeddb 提升离线存储但非无限制：支持结构化数据与事务，容量受浏览器策略约束（chrome/edge约80%磁盘、firefox首限50mb、ios safari硬限50mb），需用户交互触发、配合navigator.storage.estimate()探测，且须妥善处理打开失败、事务中断、schema升级及同步逻辑。
IndexedDB 确实能提升离线存储能力，但不是“无限制缓存盘”
它比 localStorage 强在支持结构化数据、事务、索引和大容量存储，但依然受浏览器策略约束——不是你想存多少就存多少，也不是所有环境都给你开绿灯。
IndexedDB 的实际存储上限由浏览器和用户设置共同决定
Chrome 和 Edge 默认对单个 origin 分配约 80% 磁盘空间（通常几 GB 起步），但前提是用户没手动限制、没开启无痕模式、且站点已被“信任”（比如有 HTTPS + 用户交互后触发的写入）；Firefox 则默认更保守，首次写入可能仅允许 50MB，后续需用户确认才能扩容。
- 无痕/隐私模式下，IndexedDB 是临时的，关闭窗口即清空
- 移动 Safari 对单个数据库硬性限制为 50MB（iOS 15+ 仍存在，且不提示）
- 如果页面从未获得过用户手势（如点击、触摸），
indexedDB.open()可能被静默降级或拒绝（尤其 iOS Safari） -
navigator.storage.estimate()是唯一靠谱的探测方式，但返回值是估算，不是承诺：const { usage, quota } = await navigator.storage.estimate();
离线场景下 IndexedDB 容易崩在“打开失败”和“事务中断”上
常见错误不是容量不够，而是没处理好生命周期异常：页面加载时 DB 还没 ready 就读取、网络恢复后没同步冲突、升级 schema 时旧版本页面还在运行……这些都会导致 onerror 或 onsuccess 不触发、transaction.abort() 静默发生。
html-to-pptx-converter
下载
使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。
- 永远用
indexedDB.open(dbName, version)的onupgradeneeded处理 schema 变更，别在onsuccess里建 objectStore - 读写操作必须包裹在
transaction中，且不能跨事件循环复用——每次操作都应新建事务 - 监听
blocked事件，避免新版本 DB 被旧标签页阻塞：request.onblocked = () => alert('请关闭其他标签页再试'); - 离线时写入成功 ≠ 持久化成功：部分浏览器（尤其是 Android WebView）会在内存压力大时丢弃未刷盘的 IndexedDB 数据
替代方案不是不要 IndexedDB，而是补足它的断层
IndexedDB 擅长中等规模结构化数据（如用户草稿、离线文章、表单缓存），但它不解决资源文件（图片、CSS、JS）缓存，也不自带同步逻辑。真要健壮离线，得配合其他机制：
- 用
Cache API+Service Worker缓存静态资源，和 IndexedDB 协同——前者管“文件”，后者管“数据” - 对关键操作加本地标记（如
pending_sync: true），上线后主动轮询并重试，别依赖“自动同步” - 敏感数据别全放 IndexedDB：它不加密，且可被开发者工具直接查看；密码、token 建议用
Web Crypto API加密后再存 - 别把 IndexedDB 当本地 MySQL 用：没有 JOIN、没有外键、查询只能靠 index + cursor，复杂检索建议预建好复合索引
最常被忽略的一点：IndexedDB 的“离线可用”完全依赖你是否在用户在线时已预先加载并写入了数据——它不会自动抓取线上接口结果。离线能力不是开关，是提前布设的动作。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
