No voices found \u2014 try a different search, language or filter.
';const pager=$2("fa-pager");if(pager){pager.hidden=!1,$2("fa-prev").disabled=_page<=1;const pages=Math.max(1,Math.ceil((data.total||0)/(data.page_size||24)));$2("fa-next").disabled=_page>=pages,$2("fa-pager-info").textContent=`Page ${_page} \xB7 ${(data.total||0).toLocaleString()} voices`}}async function browse(){status2("Loading voices from fish.audio\u2026"),grid.innerHTML=' Loading\u2026
';try{const d=await fetch("/api/fishaudio/voices?"+params().toString()).then(r=>{if(!r.ok)throw new Error("HTTP "+r.status);return r.json()});render(d),status2(d.offline?"\u26A0 fish.audio unreachable \u2014 showing cached results":`${(d.total||0).toLocaleString()} matching voices`,!!d.offline)}catch(e){grid.innerHTML=`Failed to load: ${esc(e.message)}
`,status2("")}}function stopPreview(){_audio&&(_audio.pause(),_audio=null),_playingCard==null||_playingCard.classList.remove("fa-card-playing"),_playingCard=null}function preview(v,el){if(_playingCard===el){stopPreview();return}stopPreview(),v.sample_audio&&(_audio=new Audio(v.sample_audio),_playingCard=el,el.classList.add("fa-card-playing"),_audio.addEventListener("ended",stopPreview),_audio.play().catch(()=>{stopPreview(),typeof toast=="function"&&toast("Could not play preview","error")}))}async function importVoice(v,el){const btn=el.querySelector(".fa-import"),orig=btn.innerHTML;btn.disabled=!0,btn.innerHTML='';const lang=(v.language||"EN").slice(0,2).toUpperCase(),base=(typeof _umlautSafe=="function"?_umlautSafe(v.title||"fishaudio"):v.title||"fishaudio").replace(/[^A-Za-z0-9]+/g,"_").replace(/^_+|_+$/g,"").slice(0,40)||"Voice",voiceId=`${lang}_${base}`;try{const r=await fetch("/api/quick-import-voice",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({voice_id:voiceId,audio_url:v.sample_audio,transcript:v.sample_text||v.default_text||""})});if(!r.ok){const e=await r.json().catch(()=>({}));throw new Error(e.detail||r.statusText)}const d=await r.json();typeof saveMeta=="function"&&await saveMeta(d.voice_id,{name:v.title||base,tag:"fish-audio",group:"fish-audio",origin:"cloned",gender:(v.gender||"").charAt(0).toUpperCase(),note:(v.description||"").slice(0,180)}).catch(()=>{}),v.image&&await fetch("/api/voice/picture-url",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({voice_id:d.voice_id,image_url:v.image})}).catch(()=>{}),btn.innerHTML=' Imported',el.classList.add("fa-card-imported"),typeof toast=="function"&&toast(`Imported "${v.title}" as ${d.voice_id}`,"success"),typeof loadVoiceLibrary=="function"&&loadVoiceLibrary().catch(()=>{})}catch(e){btn.disabled=!1,btn.innerHTML=orig,typeof toast=="function"&&toast("Import failed: "+e.message,"error")}}(_a2=$2("fa-fetch"))==null||_a2.addEventListener("click",()=>{_page=1,browse()}),(_b2=$2("fa-search"))==null||_b2.addEventListener("keydown",e=>{e.key==="Enter"&&(_page=1,browse())}),(_c2=$2("fa-tag"))==null||_c2.addEventListener("keydown",e=>{e.key==="Enter"&&(_page=1,browse(),applyFilters())}),(_d2=$2("fa-lang"))==null||_d2.addEventListener("change",()=>{_page=1,browse()}),(_e2=$2("fa-sort"))==null||_e2.addEventListener("change",()=>{_page=1,browse()}),(_f2=$2("fa-prev"))==null||_f2.addEventListener("click",()=>{_page>1&&(_page--,browse())}),(_g2=$2("fa-next"))==null||_g2.addEventListener("click",()=>{_page++,browse()});const pop=$2("fa-filter-pop");function positionPop(){const btn=$2("fa-filter-btn");if(!pop||!btn||pop.hidden)return;const r=btn.getBoundingClientRect(),w=pop.offsetWidth||320,margin=8;let left=Math.min(r.right-w,window.innerWidth-w-margin);leftNo voices match the current filters.
';return}if(window._voiceGroupByTag)renderVoicesByTag(list,filtered);else{const frag=document.createDocumentFragment();if(pageItems.forEach(v=>frag.appendChild(makeVoiceRow(v))),list.appendChild(frag),pageEndNo voices match the current filters.
';return}if(window._voiceGroupByTag)renderVoicesByTag(list,filtered);else{const frag=document.createDocumentFragment();if(pageItems.forEach(v=>frag.appendChild(makeVoiceRow(v))),list.appendChild(frag),pageEnd${avatarContent}
diff --git a/static/js/image-cache.js b/static/js/image-cache.js
new file mode 100644
index 0000000..7e71c41
--- /dev/null
+++ b/static/js/image-cache.js
@@ -0,0 +1,57 @@
+// ── Bounded decoded-image lifecycle ─────────────────────────────────────────
+// Native loading="lazy" controls network work, but browsers may retain decoded
+// pixels for every image that has entered the viewport. Keep a small LRU of
+// visible library images and drop src from old, off-screen elements so their
+// decoded surfaces can be reclaimed. data-ttvc-src restores them on re-entry.
+(function () {
+ 'use strict';
+ var root = window.TTVC = window.TTVC || {};
+ var entries = new Map();
+ var visible = new Set();
+ var observer = 'IntersectionObserver' in window ? new IntersectionObserver(function (records) {
+ records.forEach(function (record) {
+ var img = record.target;
+ if (record.isIntersecting) {
+ visible.add(img);
+ var source = img.dataset.ttvcSrc;
+ if (source && !img.getAttribute('src')) img.setAttribute('src', source);
+ entries.delete(img); entries.set(img, Date.now());
+ } else {
+ visible.delete(img);
+ }
+ });
+ evict();
+ }, { rootMargin: '160px' }) : null;
+
+ function limit() {
+ return typeof window.ttvcIsLowMemoryDevice === 'function' && window.ttvcIsLowMemoryDevice() ? 24 : 64;
+ }
+ function evict() {
+ // Disconnected nodes are no longer useful cache entries.
+ entries.forEach(function (_, img) { if (!img.isConnected) entries.delete(img); });
+ while (entries.size > limit()) {
+ var candidate = null;
+ for (var img of entries.keys()) {
+ if (!visible.has(img)) { candidate = img; break; }
+ }
+ if (!candidate) break; // never evict an image currently near the viewport
+ entries.delete(candidate);
+ if (candidate.getAttribute('src')) candidate.dataset.ttvcSrc = candidate.getAttribute('src');
+ candidate.removeAttribute('src');
+ }
+ }
+ function observeImages(container) {
+ if (!container) return;
+ container.querySelectorAll('img').forEach(function (img) {
+ if (!img.dataset.ttvcSrc && img.getAttribute('src')) img.dataset.ttvcSrc = img.getAttribute('src');
+ if (observer && !img.dataset.ttvcObserved) {
+ img.dataset.ttvcObserved = '1';
+ observer.observe(img);
+ }
+ entries.delete(img); entries.set(img, Date.now());
+ });
+ evict();
+ }
+ root.imageCache = { observe: observeImages, evict: evict, size: function () { return entries.size; } };
+ window.ttvcObserveImages = observeImages;
+})();
diff --git a/static/js/library-characters.js b/static/js/library-characters.js
index e859332..4e2ea61 100644
--- a/static/js/library-characters.js
+++ b/static/js/library-characters.js
@@ -590,6 +590,7 @@ async function libraryRenderCharacters() {
productions.appendChild(prod);
});
container.appendChild(productions);
+ if (typeof window.ttvcObserveImages === 'function') window.ttvcObserveImages(container);
// Scroll to a specific book's production block — set by callers that land
// here from a book-scoped context (e.g. the "Assign Voices" workflow step)
diff --git a/static/js/voice-library.js b/static/js/voice-library.js
index 728ef93..19f6636 100644
--- a/static/js/voice-library.js
+++ b/static/js/voice-library.js
@@ -1998,6 +1998,7 @@ function renderVoiceList() {
if (wrap) { _pendingSelectId = null; selectVoice(wrap); }
}
syncSortHeaders();
+ if (typeof window.ttvcObserveImages === 'function') window.ttvcObserveImages(list);
}
// Group the list into collapsible virtual "folders" by tag (a voice with several
diff --git a/static/module-manifest.json b/static/module-manifest.json
index f6b2feb..ac2ed74 100644
--- a/static/module-manifest.json
+++ b/static/module-manifest.json
@@ -1,6 +1,6 @@
{
"core": [
- "voice-picker", "benchmark-voice-picker", "voice-inspector", "seed-finder", "voice-sources", "fishaudio-browser", "voice-cache", "jobs",
+ "voice-picker", "benchmark-voice-picker", "voice-inspector", "seed-finder", "voice-sources", "fishaudio-browser", "voice-cache", "jobs", "image-cache",
"integrations", "routing", "voice-clone", "voice-library", "tts-preview", "generation", "benchmark", "stt", "namespace"
],
"lazy": {
diff --git a/tests/constrained.spec.js b/tests/constrained.spec.js
index ee871bd..cf79fea 100644
--- a/tests/constrained.spec.js
+++ b/tests/constrained.spec.js
@@ -101,3 +101,26 @@ test('Rehearser audio cache stays bounded with LRU eviction', async ({ page }) =
});
expect(size).toBeLessThanOrEqual(128);
});
+
+test('library image cache evicts decoded image sources but preserves restoration data', async ({ page }) => {
+ await page.goto('/', { waitUntil: 'domcontentloaded' });
+ await page.waitForFunction(() => window.TTVC?.imageCache, null, { timeout: 15_000 });
+ const result = await page.evaluate(() => {
+ const holder = document.createElement('div');
+ document.body.appendChild(holder);
+ for (let index = 0; index < 90; index += 1) {
+ const img = document.createElement('img');
+ img.src = '/api/voice/picture/cache-' + index;
+ holder.appendChild(img);
+ }
+ window.TTVC.imageCache.observe(holder);
+ const images = [...holder.querySelectorAll('img')];
+ const evicted = images.filter(img => !img.getAttribute('src'));
+ const restorable = evicted.every(img => img.dataset.ttvcSrc);
+ holder.remove();
+ return { size: window.TTVC.imageCache.size(), evicted: evicted.length, restorable };
+ });
+ expect(result.size).toBeLessThanOrEqual(64);
+ expect(result.evicted).toBeGreaterThan(0);
+ expect(result.restorable).toBeTruthy();
+});