fix(live-state): eliminate flash on poll by switching to innerHTML swap

outerHTML removes and re-inserts the section on each tick, causing a
blank frame. Keeping the <section> as a stable DOM container and
swapping only innerHTML means avatars and text update in-place without
any teardown/reconstruct cycle.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
mwiegand 2026-05-12 23:26:54 +02:00
parent 096d18ac64
commit 175e4e653c
No known key found for this signature in database
2 changed files with 59 additions and 64 deletions

View file

@ -1,7 +1,3 @@
<section class="panel live-state"
hx-get="/servers/{{ server.id }}/live-state"
hx-trigger="every {{ poll_seconds }}s"
hx-swap="outerHTML">
<h2 class="section-title">Live state</h2>
{% if not snapshot or not snapshot_fresh %}
<p class="muted">No data — server is not currently reporting.</p>
@ -62,4 +58,3 @@
{% endfor %}
</ul>
{% endif %}
</section>

View file

@ -22,7 +22,7 @@
<section class="panel live-state"
hx-get="/servers/{{ server.id }}/live-state"
hx-trigger="load, every 5s"
hx-swap="outerHTML">
hx-swap="innerHTML">
</section>
<h2 class="section-title">Files</h2>