From 9dcd5d8766db8ad8cc816989b499be5ab27b8074 Mon Sep 17 00:00:00 2001 From: WakelessSloth56 Date: Mon, 4 Mar 2024 22:31:54 +0800 Subject: [PATCH 1/8] feat: wasm cache with indexedDB Co-authored-by: lainio24 --- .../video/download/wasm-output/database.ts | 66 +++++++++++++++++++ .../video/download/wasm-output/handler.ts | 29 +++++--- .../video/download/wasm-output/utils.ts | 8 ++- 3 files changed, 91 insertions(+), 12 deletions(-) create mode 100644 registry/lib/plugins/video/download/wasm-output/database.ts diff --git a/registry/lib/plugins/video/download/wasm-output/database.ts b/registry/lib/plugins/video/download/wasm-output/database.ts new file mode 100644 index 000000000..3e795f21c --- /dev/null +++ b/registry/lib/plugins/video/download/wasm-output/database.ts @@ -0,0 +1,66 @@ +import { meta } from '@/core/meta' + +const DB_NAME = 'bilibili-evolved-wasm-output' +const DB_VERSION = parseInt(meta.compilationInfo.version.replaceAll('.', '')) + +export const storeNames = { + cache: 'cache', +} as const + +async function database() { + return new Promise((reslove: (db: IDBDatabase) => void, reject) => { + const req = unsafeWindow.indexedDB.open(DB_NAME, DB_VERSION) + req.onerror = reject + req.onupgradeneeded = () => { + const db = req.result + for (const name of db.objectStoreNames) { + db.deleteObjectStore(name) + } + Object.values(storeNames).forEach(v => { + db.createObjectStore(v) + }) + } + req.onsuccess = () => reslove(req.result) + }) +} + +async function objectStore(name: string, mode?: IDBTransactionMode) { + return database().then( + db => + new Promise((reslove: (db: IDBObjectStore) => void, reject) => { + const tr = db.transaction(name, mode) + reslove(tr.objectStore(name)) + tr.onerror = reject + }), + ) +} + +async function get(store: IDBObjectStore, key: IDBValidKey | IDBKeyRange) { + return new Promise((reslove: (db: any) => void, reject) => { + const res = store.get(key) + res.onerror = reject + res.onsuccess = () => reslove(res.result) + }) +} + +async function put(store: IDBObjectStore, value: any, key?: IDBValidKey) { + return new Promise((reslove: (db: IDBValidKey) => void, reject) => { + const res = store.put(value, key) + res.onerror = reject + res.onsuccess = () => reslove(res.result) + }) +} + +export async function getOrLoad( + storeName: K, + key: IDBValidKey, + loader: (key: IDBValidKey) => V, +) { + const value: V = await objectStore(storeName).then(store => get(store, key)) + if (value) { + return value + } + const newValue = await loader(key) + await objectStore(storeName, 'readwrite').then(store => put(store, newValue, key)) + return newValue +} diff --git a/registry/lib/plugins/video/download/wasm-output/handler.ts b/registry/lib/plugins/video/download/wasm-output/handler.ts index eec527846..e49907635 100644 --- a/registry/lib/plugins/video/download/wasm-output/handler.ts +++ b/registry/lib/plugins/video/download/wasm-output/handler.ts @@ -2,26 +2,35 @@ import { DownloadPackage } from '@/core/download' import { meta } from '@/core/meta' import { Toast } from '@/core/toast' import { FFmpeg } from './ffmpeg' -import { httpGet, toBlobUrl, toastProgress } from './utils' +import { getCacheOrGet, httpGet, toastProgress, toBlobUrl } from './utils' const ffmpeg = new FFmpeg() async function load(toast: Toast) { await ffmpeg.load({ - workerLoadURL: await toBlobUrl( - meta.compilationInfo.altCdn.library.ffmpeg.worker, + workerLoadURL: toBlobUrl( + await getCacheOrGet( + 'ffmpeg-worker', + meta.compilationInfo.altCdn.library.ffmpeg.worker, + toastProgress(toast, '正在加载 FFmpeg Worker'), + ), 'text/javascript', - toastProgress(toast, '正在加载 FFmpeg Worker'), ), - coreURL: await toBlobUrl( - meta.compilationInfo.altCdn.library.ffmpeg.core, + coreURL: toBlobUrl( + await getCacheOrGet( + 'ffmpeg-core', + meta.compilationInfo.altCdn.library.ffmpeg.core, + toastProgress(toast, '正在加载 FFmpeg Core'), + ), 'text/javascript', - toastProgress(toast, '正在加载 FFmpeg Core'), ), - wasmURL: await toBlobUrl( - meta.compilationInfo.altCdn.library.ffmpeg.wasm, + wasmURL: toBlobUrl( + await getCacheOrGet( + 'ffmpeg-wasm', + meta.compilationInfo.altCdn.library.ffmpeg.wasm, + toastProgress(toast, '正在加载 FFmpeg WASM'), + ), 'application/wasm', - toastProgress(toast, '正在加载 FFmpeg WASM'), ), }) } diff --git a/registry/lib/plugins/video/download/wasm-output/utils.ts b/registry/lib/plugins/video/download/wasm-output/utils.ts index ae4552e96..165e3559d 100644 --- a/registry/lib/plugins/video/download/wasm-output/utils.ts +++ b/registry/lib/plugins/video/download/wasm-output/utils.ts @@ -1,5 +1,6 @@ import { Toast } from '@/core/toast' import { formatFileSize, formatPercent } from '@/core/utils/formatters' +import { getOrLoad, storeNames } from './database' type OnProgress = (received: number, length: number) => void @@ -47,8 +48,11 @@ export async function httpGet(url: string, onprogress: OnProgress) { return chunksAll } -export async function toBlobUrl(url: string, mimeType: string, onprogress: OnProgress) { - const buffer = await httpGet(url, onprogress) +export async function getCacheOrGet(key: string, url: string, loading: OnProgress) { + return getOrLoad(storeNames.cache, key, async () => httpGet(url, loading)) +} + +export function toBlobUrl(buffer: Uint8Array, mimeType: string) { const blob = new Blob([buffer], { type: mimeType }) return URL.createObjectURL(blob) } From d7021e9f0f721f3f730ee99f72c444fbd270efc2 Mon Sep 17 00:00:00 2001 From: WakelessSloth56 Date: Mon, 4 Mar 2024 23:22:58 +0800 Subject: [PATCH 2/8] fix: const database version --- registry/lib/plugins/video/download/wasm-output/database.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/registry/lib/plugins/video/download/wasm-output/database.ts b/registry/lib/plugins/video/download/wasm-output/database.ts index 3e795f21c..091fbee6e 100644 --- a/registry/lib/plugins/video/download/wasm-output/database.ts +++ b/registry/lib/plugins/video/download/wasm-output/database.ts @@ -1,7 +1,5 @@ -import { meta } from '@/core/meta' - const DB_NAME = 'bilibili-evolved-wasm-output' -const DB_VERSION = parseInt(meta.compilationInfo.version.replaceAll('.', '')) +const DB_VERSION = 124 export const storeNames = { cache: 'cache', From e452bb0a4fc3b549eb8d02728ff57590cce84f78 Mon Sep 17 00:00:00 2001 From: the1812 Date: Tue, 5 Mar 2024 22:54:42 +0800 Subject: [PATCH 3/8] Add displayMode options (fix #4532) --- .../outer-watchlater/OuterWatchlater.vue | 29 ++++++++++++++++-- .../video/outer-watchlater/index.ts | 16 ++-------- .../video/outer-watchlater/options.ts | 20 +++++++++++++ .../video/quick-favorite/QuickFavorite.vue | 30 +++++++++++++++++-- .../components/video/quick-favorite/index.ts | 21 ++----------- .../video/quick-favorite/options.ts | 25 ++++++++++++++++ 6 files changed, 103 insertions(+), 38 deletions(-) create mode 100644 registry/lib/components/video/outer-watchlater/options.ts create mode 100644 registry/lib/components/video/quick-favorite/options.ts diff --git a/registry/lib/components/video/outer-watchlater/OuterWatchlater.vue b/registry/lib/components/video/outer-watchlater/OuterWatchlater.vue index f8f6c56a0..f6bd26920 100644 --- a/registry/lib/components/video/outer-watchlater/OuterWatchlater.vue +++ b/registry/lib/components/video/outer-watchlater/OuterWatchlater.vue @@ -2,7 +2,7 @@ @@ -14,14 +14,18 @@