ביצועים מקסימליים ב-IndexedDB עם קטגוריות אחסון

צוות 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) וכשהמכונות של ה-IDB מפוצלות מ-Chrome 126.

הדגמה (דמו)

אפשר לצפות בהדגמה של התכונה הזו ב- תקלה. בקוד המקור מוצג מקטעי קוד קודמים בפעולה. חשוב לעקוב בקפידה לפי ההוראות בהדגמה. אם בודקים את מכונות ה-IDB באמצעות Chrome בכלי הפיתוח אפשר לראות את קטגוריית האחסון שבשימוש בקטע Bucket name, מודגשת בתיבה אדומה בצילום המסך הבא.

כלי הפיתוח ל-Chrome בודקים את הקטע IndexedDB. יש שני מסדי נתונים של יומנים, השם של קטגוריית האחסון

אישורים

הפוסט הזה נבדק על ידי Evan Stade וגם רייצ'ל אנדרו.