Tom RochetteandBohdan Triapitsyn
1505274f94
* perf(stores): defer safeStorage writes off the interaction path Session switches funnel every persisted store slice through safeStorage.setItem, and doing those large JSON.stringify writes synchronously blocked the main thread for over a second. Add a write-behind buffer that: - Defers each setItem/removeItem to a later task via setTimeout(0) so the click-to-paint path is not blocked. - Coalesces repeated writes to the same key into a single backing flush. - Serves pending values from memory so read-after-write stays consistent within the deferral window. - Flushes synchronously on pagehide/beforeunload/visibilitychange/freeze so deferred state survives tab close, reload, and the mobile freeze lifecycle. Adds a test covering write deferral, coalescing, and pending read serving. * fix(stores): defer persisted JSON serialization * fix(stores): defer direct safeStorage writes --------- Co-authored-by: Bohdan Triapitsyn <artmore@protonmail.com>
70 lines
1.8 KiB
TypeScript
70 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
import { getDeferredSafeStorage } from '@/stores/utils/safeStorage';
|
|
import { updateDesktopSettings } from '@/lib/persistence';
|
|
|
|
const SHOW_HIDDEN_STORAGE_KEY = 'directoryTreeShowHidden';
|
|
const SHOW_HIDDEN_EVENT = 'directory-show-hidden-change';
|
|
|
|
const readStoredShowHidden = (): boolean => {
|
|
if (typeof window === 'undefined') {
|
|
return true;
|
|
}
|
|
try {
|
|
const stored = getDeferredSafeStorage().getItem(SHOW_HIDDEN_STORAGE_KEY);
|
|
if (stored === null) {
|
|
return true;
|
|
}
|
|
return stored === 'true';
|
|
} catch {
|
|
return true;
|
|
}
|
|
};
|
|
|
|
const notifyDirectoryShowHiddenChanged = () => {
|
|
if (typeof window === 'undefined') {
|
|
return;
|
|
}
|
|
window.dispatchEvent(new Event(SHOW_HIDDEN_EVENT));
|
|
};
|
|
|
|
export const setDirectoryShowHidden = (
|
|
value: boolean,
|
|
options: { persist?: boolean } = {}
|
|
) => {
|
|
if (typeof window === 'undefined') {
|
|
return;
|
|
}
|
|
try {
|
|
getDeferredSafeStorage().setItem(SHOW_HIDDEN_STORAGE_KEY, value ? 'true' : 'false');
|
|
notifyDirectoryShowHiddenChanged();
|
|
} catch {
|
|
// ignore storage errors
|
|
}
|
|
|
|
if (options.persist !== false) {
|
|
void updateDesktopSettings({ directoryShowHidden: value });
|
|
}
|
|
};
|
|
|
|
export const useDirectoryShowHidden = (): boolean => {
|
|
const [showHidden, setShowHidden] = React.useState(readStoredShowHidden);
|
|
|
|
React.useEffect(() => {
|
|
if (typeof window === 'undefined') {
|
|
return;
|
|
}
|
|
const handleChange = () => {
|
|
setShowHidden(readStoredShowHidden());
|
|
};
|
|
|
|
window.addEventListener('storage', handleChange);
|
|
window.addEventListener(SHOW_HIDDEN_EVENT, handleChange);
|
|
return () => {
|
|
window.removeEventListener('storage', handleChange);
|
|
window.removeEventListener(SHOW_HIDDEN_EVENT, handleChange);
|
|
};
|
|
}, []);
|
|
|
|
return showHidden;
|
|
};
|