Reference

Root, handles & CRUD

Compressed main-thread OPFS map. Pair with Lesson 2. Sync access handles: Lesson 3 / sheet.

Lesson 2 Lesson 3 Sync access Glossary Resources

Open the root

const root = await navigator.storage.getDirectory();
// FileSystemDirectoryHandle — empty name "", kind "directory"

Create / open children

Call Does
dir.getFileHandle(name, { create: true }) Open file handle; create file if missing
dir.getDirectoryHandle(name, { create: true }) Open directory handle; create folder if missing
dir.getFileHandle(name) / getDirectoryHandle(name) Open existing only; rejects if absent

Read / write (main thread async)

// Read → File (a Blob)
const file = await fileHandle.getFile();
const text = await file.text();
// also: file.arrayBuffer(), file.stream()

// Write → stream, then close to persist
const writable = await fileHandle.createWritable();
await writable.write("Some text");
await writable.close();

Delete

Call Does
handle.remove() Remove this file/dir (dir: optional { recursive: true }). Feature-detect: "remove" in FileSystemFileHandle.prototype
dir.removeEntry(name) Remove child by name (wider support pattern)
(await navigator.storage.getDirectory()).remove({ recursive: true }) Wipe entire OPFS root (nuclear option)

List

for await (const [name, handle] of directoryHandle.entries()) {
  // handle.kind === "file" | "directory"
}

See also