perf: inline SVGs, memoize grid slices, batch store notifications
- Replace wa-icon shadow DOM with inline SVG in queue-panel (xmark) and album-dropdown (fav icons) to eliminate per-item shadow roots - Memoize getBeforeEntries/getAfterEntries in cover-grid to prevent .slice() creating new array refs that trigger virtualizer relayout - Remove transition: scale and border-radius from album cards to avoid per-frame repaints and anti-aliased path clipping - Add queueMicrotask batching to player-store and favorites-store notify() to coalesce rapid-fire updates into single renders
This commit is contained in:
@@ -34,6 +34,7 @@ class FavoritesStore {
|
||||
private pinDefault = true;
|
||||
private favoritedPaths = new Set<string>();
|
||||
private subscribers = new Set<Subscriber>();
|
||||
private notifyScheduled = false;
|
||||
private loading = false;
|
||||
|
||||
constructor() {
|
||||
@@ -232,7 +233,14 @@ class FavoritesStore {
|
||||
}
|
||||
|
||||
private notify(): void {
|
||||
this.subscribers.forEach((cb) => cb());
|
||||
if (this.notifyScheduled) return;
|
||||
this.notifyScheduled = true;
|
||||
queueMicrotask(() => {
|
||||
this.notifyScheduled = false;
|
||||
for (const cb of this.subscribers) {
|
||||
cb();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// ===============================================================
|
||||
|
||||
@@ -41,6 +41,7 @@ class PlayerStore {
|
||||
};
|
||||
|
||||
private subscribers = new Set<Subscriber>();
|
||||
private notifyScheduled = false;
|
||||
|
||||
constructor() {
|
||||
this.initializeEventListeners();
|
||||
@@ -115,7 +116,14 @@ class PlayerStore {
|
||||
}
|
||||
|
||||
private notify(): void {
|
||||
this.subscribers.forEach((callback) => callback());
|
||||
if (this.notifyScheduled) return;
|
||||
this.notifyScheduled = true;
|
||||
queueMicrotask(() => {
|
||||
this.notifyScheduled = false;
|
||||
for (const sub of this.subscribers) {
|
||||
sub();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user