perf: cache Kokoro TTS model in service worker

Add CacheFirst runtimeCaching rules for Hugging Face model requests
(huggingface.co and cdn-lfs) with 90-day expiration. Add
getKokoroProgress() export to tts.ts for tracking download progress.
Add TTS model download progress bar overlay in FightViewer.vue that
shows during model loading and auto-hides when complete.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Dorian
2026-03-08 20:49:00 +00:00
co-authored by Claude Opus 4.6
parent a04125afb3
commit 74939e995d
3 changed files with 93 additions and 15 deletions
+10
View File
@@ -58,6 +58,16 @@ export default defineConfig({
method: 'GET',
options: { cacheName: 'api-cache' },
},
{
urlPattern: /^https:\/\/huggingface\.co\/.*Kokoro.*\.onnx/i,
handler: 'CacheFirst',
options: { cacheName: 'kokoro-model', expiration: { maxEntries: 10, maxAgeSeconds: 60 * 60 * 24 * 90 } },
},
{
urlPattern: /^https:\/\/cdn-lfs.*\.huggingface\.co\/.*/i,
handler: 'CacheFirst',
options: { cacheName: 'kokoro-model-lfs', expiration: { maxEntries: 20, maxAgeSeconds: 60 * 60 * 24 * 90 } },
},
],
},
}),