demo · v133
OPFS live editor — the inotify use case
Two tabs of the same app sync their file list because FileSystemObserver tells each one when the other writes to OPFS. Open this demo in two windows and watch the sidebar update instantly — no polling, no BroadcastChannel.
FileSystemObserver is not supported here. Saves still work; the sidebar only updates on the tab that saved. Needs Chrome 133+.
editor
OPFS root (live)
how the wiring works
const root = await navigator.storage.getDirectory();
const observer = new FileSystemObserver((records) => {
for (const r of records) {
refreshSidebar();
}
});
await observer.observe(root, { recursive: true });Without FileSystemObserver, the alternative was to setInterval every couple of seconds and re-list the directory — expensive, laggy, pointless for files that hardly ever change. The motivating use cases are exactly this: collaborative editors, file managers, IDE-style apps.