El equipo de Chrome realizó varias mejoras relacionadas con el rendimiento en la implementación de IndexedDB (IDB). Una de esas mejoras fue mover el almacenamiento en caché de cada instancia a una secuencia independiente (puedes considerarlo como un subproceso independiente). Esto significa que el uso simultáneo de IDB ahora es más rápido, ya sea desde el mismo sitio o desde varios sitios. En esta publicación, se proporcionan todos los detalles y se explica lo que debes hacer para aprovechar este cambio, que está disponible a partir de Chrome 126.
Entre sitios
Si usas el IDB en varios sitios, no necesitas hacer nada. Una vez que se realiza este movimiento a nivel del navegador y el almacenamiento en caché de cada instancia de IDB se mueve a una secuencia independiente, el aumento de rendimiento se produce sin que tengas que hacer nada.
SameSite
Para obtener esta mejora de rendimiento en el uso del mismo sitio, debes separar el uso de tu IDB en diferentes instancias, es decir, buckets de almacenamiento. En la siguiente muestra de código, se muestra cómo puede funcionar esto:
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. */
};
Navegadores compatibles
El aumento de rendimiento que se menciona en esta publicación es una mejora progresiva que puedes usar cuando la API de Storage Buckets es compatible con tu navegador (a partir de Chrome 122) y cuando las instancias de IDB se fragmentan, a partir de Chrome 126.
Demostración
Consulta la demo de esta función en Glitch. El código fuente muestra el concepto del fragmento de código anterior en acción. Asegúrate de seguir cuidadosamente las instrucciones de la demostración. Si inspeccionas las instancias de IDB con las Herramientas para desarrolladores de Chrome, puedes ver el bucket de almacenamiento utilizado en la sección Nombre del bucket, que se destaca con un cuadro rojo en la siguiente captura de pantalla.
Vínculos relacionados
- No todo el almacenamiento es igual: presentamos los buckets de almacenamiento
- Especificación en borrador
- Explicaciones
Agradecimientos
Esta publicación fue revisada por Evan Stade y Rachel Andrew.