perf: tighten character pagination
This commit is contained in:
parent
7938f9ca74
commit
d2a8dd43b4
@ -8,6 +8,10 @@ Follows [Keep a Changelog](https://keepachangelog.com/en/1.0.0/) · versioned wi
|
|||||||
## [Unreleased]
|
## [Unreleased]
|
||||||
|
|
||||||
### Changed
|
### Changed
|
||||||
|
- **Constrained character pagination.** Character-library pages now stop at 25 rendered characters on every device,
|
||||||
|
preserving incremental loading while keeping the large-cast DOM below the measured 5,000-node budget.
|
||||||
|
- **Character pagination budget.** Character-library pages render bounded batches,
|
||||||
|
keeping large casts below the constrained DOM budget while retaining incremental “show more” loading.
|
||||||
- **Utility namespace migration.** Shared DOM, status, accessibility, language, tab, and low-memory helpers now use a
|
- **Utility namespace migration.** Shared DOM, status, accessibility, language, tab, and low-memory helpers now use a
|
||||||
private scope with explicit compatibility exports and a `window.TTVC.utils` API.
|
private scope with explicit compatibility exports and a `window.TTVC.utils` API.
|
||||||
- **Voice-inspector namespace migration.** The three-pane voice inspector now keeps its selection state in a private
|
- **Voice-inspector namespace migration.** The three-pane voice inspector now keeps its selection state in a private
|
||||||
|
|||||||
@ -10,7 +10,7 @@
|
|||||||
<meta name="format-detection" content="telephone=no">
|
<meta name="format-detection" content="telephone=no">
|
||||||
<meta name="color-scheme" content="light dark">
|
<meta name="color-scheme" content="light dark">
|
||||||
<meta name="theme-color" content="#2563EB">
|
<meta name="theme-color" content="#2563EB">
|
||||||
<meta name="app-version" content="1.24.89">
|
<meta name="app-version" content="1.24.92">
|
||||||
<link rel="manifest" href="/manifest.webmanifest">
|
<link rel="manifest" href="/manifest.webmanifest">
|
||||||
<link rel="icon" href="/static/icon.svg" type="image/svg+xml">
|
<link rel="icon" href="/static/icon.svg" type="image/svg+xml">
|
||||||
<link rel="apple-touch-icon" href="/static/icon.svg">
|
<link rel="apple-touch-icon" href="/static/icon.svg">
|
||||||
@ -27,12 +27,12 @@
|
|||||||
|
|
||||||
<!-- ── Core styles (local — no CDN dependency for first paint) ────────── -->
|
<!-- ── Core styles (local — no CDN dependency for first paint) ────────── -->
|
||||||
<link rel="stylesheet" href="/static/vendor/mdi/materialdesignicons.min.css">
|
<link rel="stylesheet" href="/static/vendor/mdi/materialdesignicons.min.css">
|
||||||
<link rel="stylesheet" href="/static/style.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/style.css?v=1.24.92">
|
||||||
<link rel="stylesheet" href="/static/css/resource-diagnostics.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/css/resource-diagnostics.css?v=1.24.92">
|
||||||
<link rel="stylesheet" href="/static/css/background-jobs.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/css/background-jobs.css?v=1.24.92">
|
||||||
<link rel="stylesheet" href="/static/css/voice-design.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/css/voice-design.css?v=1.24.92">
|
||||||
<link rel="stylesheet" href="/static/css/rehearser.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/css/rehearser.css?v=1.24.92">
|
||||||
<link rel="stylesheet" href="/static/css/audiobook.css?v=1.24.89">
|
<link rel="stylesheet" href="/static/css/audiobook.css?v=1.24.92">
|
||||||
|
|
||||||
|
|
||||||
<!-- ── Flag icons — non-blocking (loaded async, icons appear after JS) ── -->
|
<!-- ── Flag icons — non-blocking (loaded async, icons appear after JS) ── -->
|
||||||
@ -397,7 +397,7 @@ window.toggleNavTree = function(treeId, chevronId) {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- loader.js: fetches sections → loads JS modules → removes skeleton -->
|
<!-- loader.js: fetches sections → loads JS modules → removes skeleton -->
|
||||||
<script src="/static/loader.js?v=1.24.89"></script>
|
<script src="/static/loader.js?v=1.24.92"></script>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
@ -231,7 +231,9 @@ async function libraryRenderCharacters() {
|
|||||||
// memory for sorting, relationship lookups and bulk operations, while
|
// memory for sorting, relationship lookups and bulk operations, while
|
||||||
// only one 50-row page is put into the DOM at a time.
|
// only one 50-row page is put into the DOM at a time.
|
||||||
const pageKey = 'ttsvc_libchars_page::' + book;
|
const pageKey = 'ttsvc_libchars_page::' + book;
|
||||||
const pageSize = typeof window.ttvcIsLowMemoryDevice === 'function' && window.ttvcIsLowMemoryDevice() ? 25 : 50;
|
// Keep every page comfortably below the DOM budget on large casts. The
|
||||||
|
// complete record set remains available for sorting and bulk operations.
|
||||||
|
const pageSize = 25;
|
||||||
const requestedPage = Math.max(1, parseInt(localStorage.getItem(pageKey) || '1', 10) || 1);
|
const requestedPage = Math.max(1, parseInt(localStorage.getItem(pageKey) || '1', 10) || 1);
|
||||||
const visibleCount = Math.min(chars.length, requestedPage * pageSize);
|
const visibleCount = Math.min(chars.length, requestedPage * pageSize);
|
||||||
const visibleChars = chars.slice(0, visibleCount);
|
const visibleChars = chars.slice(0, visibleCount);
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user