디렉터리 및 카테고리 페이지에서 탐색시의 깜빡임 현상 완화

This commit is contained in:
static
2026-01-06 06:48:35 +09:00
parent ae1d34fc6b
commit 1d3704bfad
10 changed files with 405 additions and 296 deletions

View File

@@ -116,6 +116,6 @@ const storeToIndexedDB = (info: CategoryInfo) => {
return { ...info, exists: true as const };
};
export const getCategoryInfo = async (id: CategoryId, masterKey: CryptoKey) => {
return await cache.get(id, masterKey);
export const getCategoryInfo = (id: CategoryId, masterKey: CryptoKey) => {
return cache.get(id, masterKey);
};

View File

@@ -97,6 +97,6 @@ const storeToIndexedDB = (info: DirectoryInfo) => {
return { ...info, exists: true as const };
};
export const getDirectoryInfo = async (id: DirectoryId, masterKey: CryptoKey) => {
return await cache.get(id, masterKey);
export const getDirectoryInfo = (id: DirectoryId, masterKey: CryptoKey) => {
return cache.get(id, masterKey);
};

View File

@@ -168,10 +168,10 @@ const bulkStoreToIndexedDB = (infos: FileInfo[]) => {
return infos.map((info) => [info.id, { ...info, exists: true }] as const);
};
export const getFileInfo = async (id: number, masterKey: CryptoKey) => {
return await cache.get(id, masterKey);
export const getFileInfo = (id: number, masterKey: CryptoKey) => {
return cache.get(id, masterKey);
};
export const bulkGetFileInfo = async (ids: number[], masterKey: CryptoKey) => {
return await cache.bulkGet(new Set(ids), masterKey);
export const bulkGetFileInfo = (ids: number[], masterKey: CryptoKey) => {
return cache.bulkGet(new Set(ids), masterKey);
};

View File

@@ -29,8 +29,6 @@ export class FilesystemCache<K, V extends object> {
this.map.set(key, newState);
}
state.promise = newPromise;
(state.value
? Promise.resolve(state.value)
: this.options.fetchFromIndexedDB(key).then((loadedInfo) => {
@@ -54,7 +52,8 @@ export class FilesystemCache<K, V extends object> {
state.promise = undefined;
});
return newPromise;
state.promise = newPromise;
return state.value ?? newPromise;
});
}
@@ -108,12 +107,17 @@ export class FilesystemCache<K, V extends object> {
});
});
return Promise.all(
const bottleneckPromises = Array.from(
keys
.keys()
.filter((key) => this.map.get(key)!.value === undefined)
.map((key) => this.map.get(key)!.promise!),
).then(() => new Map(keys.keys().map((key) => [key, this.map.get(key)!.value!] as const)));
);
const makeResult = () =>
new Map(keys.keys().map((key) => [key, this.map.get(key)!.value!] as const));
return bottleneckPromises.length > 0
? Promise.all(bottleneckPromises).then(makeResult)
: makeResult();
});
}
}