Skip to content

Window resize handler runs ensureCorrectZones on every event with no debounce #3540

@koala73

Description

@koala73

Summary

src/app/panel-layout.ts:1564:

window.addEventListener('resize', () => this.ensureCorrectZones());

No debounce. While the user drags a window edge, resize fires continuously (often 60+ events per second). ensureCorrectZones does querySelectorAll + DOM re-parenting (panel zone reconciliation) — running it per pixel is wasteful and visibly janky on slower machines.

(Auditor's original line cite was 1550; actual is ~1564 in current main.)

Likely fix

Wrap in a small debounce (or requestAnimationFrame throttle if the work needs to feel synchronous to the user):

const debouncedEnsureZones = debounce(() => this.ensureCorrectZones(), 100);
window.addEventListener('resize', debouncedEnsureZones);

100ms feels instant to users while collapsing a typical resize gesture from ~120 fires to 1-2.

Severity

P1 — visible jank during window resize on machines without dedicated GPUs.

Source

Manual code review (deepseek perf list, validated 2026-05-01).

Metadata

Metadata

Assignees

No one assigned

    Labels

    P1High priority, fix soonarea: panelsPanel system, layout, drag-and-dropbugSomething isn't workingperformancePerformance optimization

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions