Chrome 团队已对 Chrome 浏览器和 Chrome 浏览器 IndexedDB (IDB) 的实现。其中一项改进就是将 将每个实例的后备存储空间存储到一个单独的序列中(可以将这个 大致视为一个单独的线程)。这意味着,当同时使用 IDB 时, 无论是来自同一网站还是跨网站,现在都能够提高速度。这篇帖子 并说明您需要采取哪些措施才能充分利用这一举措, (Chrome 126 中提供)。
跨网站
如果您在跨网站使用 IDB,则无需执行任何操作。完成上述 发生了浏览器级别的迁移,每个 IDB 实例的后备存储空间都是 移到一个单独的序列中, 什么都行
同网站
要针对同网站使用实现这种性能提升,您需要将 将 IDB 用量复制到不同的实例中 存储分区。以下代码示例 其工作原理如下:
const request = indexedDB.open('main', 1);
request.onsuccess = (event) => {
/* Do stuff with the main instance. */
};
// By default, just use the regular IDB instance.
let idb = indexedDB;
// Open a separate storage bucket if the API is supported.
if ('storageBuckets' in navigator) {
const bucket = await navigator.storageBuckets.open('logs-bucket');
// Get access to the storage bucket's IDB instance.
idb = bucket.indexedDB;
}
const bucketRequest = idb.open('logs', 1);
bucketRequest.onsuccess = (event) => {
/* Do stuff with the separate instance. */
};
浏览器支持
本博文中提到的效果提升是一项渐进的增强功能, 您可以使用浏览器支持 Storage Buckets API 的情况 (从 Chrome 122 中)以及在 Chrome 126 中将 IDB 实例分片时。
演示
如需查看此功能的演示,请访问 故障。源代码显示了 上一个代码段的实际应用概念请务必严格遵循 请参阅演示中的说明如果您使用 Chrome 检查 IDB 实例 在开发者工具中,您可以在存储分区名称部分查看已使用的存储分区, 在下面的屏幕截图中以红色框突出显示。
相关链接
致谢
此帖子的审核者: Evan Stade 和 Rachel Andrew。