# plasma4/runtimefs architecture

> Architecture diagram of the GitHub repository plasma4/runtimefs, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-11-15). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/plasma4/runtimefs
- Repository: https://github.com/plasma4/runtimefs

## Overview

RuntimeFS is a browser-hosted offline file system: users import folders into local OPFS, then open projects through a ServiceWorker-backed virtual localhost. Its other major workflows are folder encryption and import/export of files and browser data. The map preserves those documented capabilities; unsampled UI and export/import wiring is linked only where the README supports it.

Main entry points: [`little-export.core.js`](https://github.com/plasma4/runtimefs/blob/main/little-export.core.js) (LittleExport), [`rfs.js`](https://github.com/plasma4/runtimefs/blob/main/rfs.js) (RuntimeFS UI), [`sw.js`](https://github.com/plasma4/runtimefs/blob/main/sw.js) (Virtual File Serving), [`cbor-x.js`](https://github.com/plasma4/runtimefs/blob/main/cbor-x.js) (CBOR Codec)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_management["Folder Management"]
  node_ui["RuntimeFS UI<br/>[rfs.js]"]
  node_folder_import["Folder Import<br/>[rfs.js]"]
  node_folder_store[("OPFS Folders")]
  node_registry[("Folder Registry<br/>[rfs.js]")]
  node_folder_encrypt["Folder Encryption<br/>[rfs.js]"]
  node_folder_open["Folder Opening<br/>[rfs.js]"]
end

subgraph group_serving["Virtual File Serving"]
  node_sw["Service Worker<br/>[sw.js]"]
  node_virtual_files["Virtual File Serving<br/>[sw.js]"]
  node_request_rules["URL Rules<br/>[sw.js]"]
  node_custom_headers["Custom Headers<br/>[sw.js]"]
  node_offline_shell["Offline App Shell<br/>[sw.js]"]
end

subgraph group_transfer["Data Transfer"]
  node_little_export["LittleExport"]
  node_archive["Tar Gzip Archive"]
  node_archive_crypto["Archive Encryption"]
  node_browser_data[("Browser Data")]
  node_cbor["CBOR Codec<br/>[cbor-x.js]"]
end

subgraph group_runtime["Browser Runtime"]
  node_browser["Browser Platform"]
end

node_user(("User"))

node_user -->|"uses"| node_ui
node_ui -->|"imports folders"| node_folder_import
node_folder_import -->|"writes files"| node_folder_store
node_folder_import -->|"updates registry"| node_registry
node_ui -->|"encrypts folders"| node_folder_encrypt
node_folder_encrypt -->|"stores encrypted data"| node_folder_store
node_ui -->|"opens folders"| node_folder_open
node_folder_open -->|"reads metadata"| node_registry
node_folder_open -->|"prepares session"| node_sw
node_sw -->|"routes requests"| node_virtual_files
node_virtual_files -->|"reads files"| node_folder_store
node_virtual_files -->|"applies rules"| node_request_rules
node_virtual_files -->|"sets headers"| node_custom_headers
node_sw -->|"caches app shell"| node_offline_shell
node_browser -->|"dispatches requests"| node_sw
node_user -->|"imports or exports"| node_little_export
node_little_export -->|"streams archive"| node_archive
node_little_export -->|"encrypts archive"| node_archive_crypto
node_little_export -->|"transfers data"| node_browser_data
node_little_export -->|"transfers files"| node_folder_store
node_little_export -.->|"encodes records"| node_cbor

click node_ui "https://github.com/plasma4/runtimefs/blob/main/rfs.js"
click node_folder_import "https://github.com/plasma4/runtimefs/blob/main/rfs.js"
click node_registry "https://github.com/plasma4/runtimefs/blob/main/rfs.js"
click node_folder_encrypt "https://github.com/plasma4/runtimefs/blob/main/rfs.js"
click node_folder_open "https://github.com/plasma4/runtimefs/blob/main/rfs.js"
click node_sw "https://github.com/plasma4/runtimefs/blob/main/sw.js"
click node_virtual_files "https://github.com/plasma4/runtimefs/blob/main/sw.js"
click node_request_rules "https://github.com/plasma4/runtimefs/blob/main/sw.js"
click node_custom_headers "https://github.com/plasma4/runtimefs/blob/main/sw.js"
click node_offline_shell "https://github.com/plasma4/runtimefs/blob/main/sw.js"
click node_little_export "https://github.com/plasma4/runtimefs/blob/main/little-export.core.js"
click node_archive "https://github.com/plasma4/runtimefs/blob/main/little-export.core.js"
click node_archive_crypto "https://github.com/plasma4/runtimefs/blob/main/little-export.core.js"
click node_cbor "https://github.com/plasma4/runtimefs/blob/main/cbor-x.js"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_ui,node_folder_import,node_folder_store,node_registry,node_folder_encrypt,node_folder_open,node_user toneBlue
class node_sw,node_virtual_files,node_request_rules,node_custom_headers,node_offline_shell toneAmber
class node_little_export,node_archive,node_archive_crypto,node_browser_data,node_cbor toneMint
class node_browser toneRose
```

## Components

### Folder Management

- [RuntimeFS UI](https://github.com/plasma4/runtimefs/blob/main/rfs.js): `rfs.js`
- [Folder Import](https://github.com/plasma4/runtimefs/blob/main/rfs.js): `rfs.js`
- **OPFS Folders**
- [Folder Registry](https://github.com/plasma4/runtimefs/blob/main/rfs.js): `rfs.js`
- [Folder Encryption](https://github.com/plasma4/runtimefs/blob/main/rfs.js): `rfs.js`
- [Folder Opening](https://github.com/plasma4/runtimefs/blob/main/rfs.js): `rfs.js`

### Virtual File Serving

- [Service Worker](https://github.com/plasma4/runtimefs/blob/main/sw.js): `sw.js`
- [Virtual File Serving](https://github.com/plasma4/runtimefs/blob/main/sw.js): `sw.js`
- [URL Rules](https://github.com/plasma4/runtimefs/blob/main/sw.js): `sw.js`
- [Custom Headers](https://github.com/plasma4/runtimefs/blob/main/sw.js): `sw.js`
- [Offline App Shell](https://github.com/plasma4/runtimefs/blob/main/sw.js): `sw.js`

### Data Transfer

- [LittleExport](https://github.com/plasma4/runtimefs/blob/main/little-export.core.js): `little-export.core.js`
- [Tar Gzip Archive](https://github.com/plasma4/runtimefs/blob/main/little-export.core.js): `little-export.core.js`
- [Archive Encryption](https://github.com/plasma4/runtimefs/blob/main/little-export.core.js): `little-export.core.js`
- **Browser Data**
- [CBOR Codec](https://github.com/plasma4/runtimefs/blob/main/cbor-x.js): `cbor-x.js`

### Browser Runtime

- **Browser Platform**

### Other components

- **User**

## Connections

- User → RuntimeFS UI: uses (evidence: `README.md`)
- RuntimeFS UI → Folder Import: imports folders (evidence: `rfs.js`)
- Folder Import → OPFS Folders: writes files (evidence: `rfs.js`)
- Folder Import → Folder Registry: updates registry (evidence: `rfs.js`)
- RuntimeFS UI → Folder Encryption: encrypts folders (evidence: `README.md`)
- Folder Encryption → OPFS Folders: stores encrypted data (evidence: `rfs.js`)
- RuntimeFS UI → Folder Opening: opens folders (evidence: `rfs.js`)
- Folder Opening → Folder Registry: reads metadata (evidence: `rfs.js`)
- Folder Opening → Service Worker: prepares session (evidence: `sw.js`)
- Service Worker → Virtual File Serving: routes requests (evidence: `sw.js`)
- Virtual File Serving → OPFS Folders: reads files (evidence: `sw.js`)
- Virtual File Serving → URL Rules: applies rules (evidence: `sw.js`)
- Virtual File Serving → Custom Headers: sets headers (evidence: `sw.js`)
- Service Worker → Offline App Shell: caches app shell (evidence: `sw.js`)
- Browser Platform → Service Worker: dispatches requests (evidence: `sw.js`)
- User → LittleExport: imports or exports (evidence: `README.md`)
- LittleExport → Tar Gzip Archive: streams archive (evidence: `little-export.core.js`)
- LittleExport → Archive Encryption: encrypts archive (evidence: `little-export.core.js`)
- LittleExport → Browser Data: transfers data (evidence: `little-export.core.js`)
- LittleExport → OPFS Folders: transfers files (evidence: `little-export.core.js`)
- LittleExport → CBOR Codec: encodes records