1
const handle = await fileHandle.createSyncAccessHandle();
2
// TypeError: fileHandle.createSyncAccessHandle is not a function

1
localStorage.setItem('count', 1);
2
localStorage.getItem('count'); // "1"，不是 1

1
// 每次按键都跑一遍，文档越大越慢
2
editor.addEventListener('input', () => {
3
  localStorage.setItem('draft', editor.value);
4
});

1
function measureLocalStorage(chars = 200_000) {
2
  const key = '__storage_bench__';
3
  const value = 'x'.repeat(chars);
4

5
  const t0 = performance.now();
6
  localStorage.setItem(key, value);
7
  const t1 = performance.now();
8
  localStorage.getItem(key);
9
  const t2 = performance.now();
10
  localStorage.removeItem(key);
11

12
  return {
13
    setMs: +(t1 - t0).toFixed(2),
14
    getMs: +(t2 - t1).toFixed(2),
15
    chars,
16
  };
17
}

1
function localStorageBudget() {
2
  const key = '__quota_probe__';
3
  const chunk = 'x'.repeat(1024 * 256); // 每次 256K 字符
4
  let written = 0;
5

6
  try {
7
    for (;;) {
8
      localStorage.setItem(`${key}${written}`, chunk);
9
      written += chunk.length;
10
    }
11
  } catch (err) {
12
    // QuotaExceededError（Safari 旧实现可能抛 NS_ERROR_DOM_QUOTA_REACHED）
13
    if (err.name !== 'QuotaExceededError' &&
14
        err.name !== 'NS_ERROR_DOM_QUOTA_REACHED') {
15
      throw err;
16
    }
17
  } finally {
18
    for (let i = 0; i < written; i += chunk.length) {
19
      localStorage.removeItem(`${key}${i}`);
20
    }
21
  }
22

23
  return written; // 大约能写的字符数
24
}

1
function safeSetItem(key, value) {
2
  try {
3
    localStorage.setItem(key, value);
4
    return true;
5
  } catch (err) {
6
    if (err.name === 'QuotaExceededError' ||
7
        err.name === 'NS_ERROR_DOM_QUOTA_REACHED') {
8
      return false; // 交给上层降级，比如转存 IndexedDB 或提示用户
9
    }
10
    throw err;
11
  }
12
}

1
function openDB() {
2
  return new Promise((resolve, reject) => {
3
    const req = indexedDB.open('notes', 3);
4

5
    req.onupgradeneeded = (event) => {
6
      const db = req.result;
7
      const tx = req.transaction;
8

9
      if (event.oldVersion < 1) {
10
        const drafts = db.createObjectStore('drafts', { keyPath: 'id' });
11
        drafts.createIndex('updatedAt', 'updatedAt');
12
      }
13

14
      if (event.oldVersion < 2) {
15
        const outbox = db.createObjectStore('outbox', {
16
          keyPath: 'seq',
17
          autoIncrement: true,
18
        });
19
        outbox.createIndex('status', 'status');
20
      }
21

22
      if (event.oldVersion < 3) {
23
        // 只使用 IDB 请求做迁移，不要在这里 await 外部 Promise
24
        const store = tx.objectStore('drafts');
25
        store.openCursor().onsuccess = (e) => {
26
          const cursor = e.target.result;
27
          if (!cursor) return;
28
          const value = cursor.value;
29
          if (value.schemaVersion !== 3) {
30
            cursor.update({ ...value, schemaVersion: 3 });
31
          }
32
          cursor.continue();
33
        };
34
      }
35
    };
36

37
    req.onblocked = () => {
38
      // 另一个标签页还握着旧版本连接，升级被阻塞
39
      console.warn('旧版本连接未关闭，数据库升级被阻塞');
40
    };
41

42
    req.onsuccess = () => {
43
      const db = req.result;
44
      db.onversionchange = () => db.close(); // 别挡住别的标签页升级
45
      resolve(db);
46
    };
47

48
    req.onerror = () => reject(req.error);
49
  });
50
}

1
const root = await navigator.storage.getDirectory();
2
const file = await root.getFileHandle('draft.bin', { create: true });

1
const writable = await file.createWritable();
2
await writable.write(new TextEncoder().encode('hello'));
3
await writable.close(); // close 时才真正提交

1
const CACHE = 'static-v3';
2

3
self.addEventListener('activate', (event) => {
4
  event.waitUntil(
5
    caches.keys().then((keys) =>
6
      Promise.all(keys.filter((key) => key !== CACHE).map((key) => caches.delete(key)))
7
    )
8
  );
9
});

1
await navigator.locks.request(`draft:${id}`, async () => {
2
  const current = await loadDraft(id);
3
  await saveDraft({ ...current, ...patch, version: current.version + 1 });
4
});

1
async function probeStorage() {
2
  const result = {
3
    localStorage: false,
4
    indexedDB: false,
5
    opfs: false,
6
    cacheStorage: false,
7
    estimate: null,
8
  };
9

10
  try {
11
    localStorage.setItem('__probe__', '1');
12
    localStorage.removeItem('__probe__');
13
    result.localStorage = true;
14
  } catch {
15
    // 无痕模式或配额为 0 时可能直接失败
16
  }
17

18
  result.indexedDB = typeof indexedDB !== 'undefined';
19
  result.opfs = hasOPFS();
20
  result.cacheStorage = typeof caches !== 'undefined';
21

22
  if (navigator.storage?.estimate) {
23
    result.estimate = await navigator.storage.estimate();
24
  }
25

26
  return result;
27
}