Fixes #7: Rendering performance optimizations

- requestAnimationFrame batching: rerenderRpgState() now batches all
  render calls into a single animation frame, reducing reflow/repaint costs

- Lightweight change detection: Render functions use updateIfChanged() to
  skip DOM updates when content hasn't changed, and only re-bind event
  handlers when the DOM was actually updated

- CSS content-visibility: Added content-visibility: auto with
  contain-intrinsic-size to inventory and equipment containers, deferring
  rendering of off-screen content

New file: src/systems/rendering/renderUtils.js (rendering utilities module)
Updated: All render modules + sillytavern.js integration + style.css
This commit is contained in:
2026-07-12 13:10:17 +02:00
parent 1f8591d4ec
commit 24c964c38d
9 changed files with 239 additions and 40 deletions
+4
View File
@@ -6881,6 +6881,8 @@ body:has(.rpg-panel.rpg-mobile-open) .rpg-fab-widget-container {
gap: 1rem;
padding: 0.5rem;
font-size: 0.9rem;
content-visibility: auto;
contain-intrinsic-size: 0 500px;
}
/* Sub-tabs Navigation */
@@ -12079,6 +12081,8 @@ body.documentstyle .rpg-inline-thoughts {
.rpg-equipment-container {
padding: 8px 0;
content-visibility: auto;
contain-intrinsic-size: 0 300px;
}
.rpg-equipment-header {