# yunuseeeeeeee/yunze-transfer architecture

> Architecture diagram of the GitHub repository yunuseeeeeeee/yunze-transfer, 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/yunuseeeeeeee/yunze-transfer
- Repository: https://github.com/yunuseeeeeeee/yunze-transfer

## Overview

Yunze is a browser-based peer-to-peer file-sharing app. A user creates or joins a room; PeerJS signaling helps establish a WebRTC connection, then files and chat messages travel over its DataChannel. The app also supports QR pairing, batch transfers, previews, wake lock, and optional cloud sharing. The runtime is concentrated in app.js; the README documents several capabilities whose implementation excerpts were not shown, so those links are cited to the README rather than inferred from unsampled code.

Main entry points: [`app.js`](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js) (Room Controls), [`manifest.json`](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/manifest.json) (PWA Install)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_pairing["Room Pairing"]
  node_room_ui["Room Controls<br/>[app.js]"]
  node_qr_pairing["QR Pairing<br/>[app.js]"]
  node_peerjs["PeerJS Signaling"]
end

subgraph group_transfer["Transfer Session"]
  node_webrtc["WebRTC Connection"]
  node_datachannel["DataChannel"]
  node_file_transfer["Chunked File Transfer<br/>[app.js]"]
  node_batch_transfer["Batch Transfers<br/>[app.js]"]
end

subgraph group_extras["Session Features"]
  node_chat["In-session Chat<br/>[app.js]"]
  node_media_preview["Inline Previews<br/>[app.js]"]
  node_cloud_share["Cloud Share<br/>[app.js]"]
  node_cloud_service["gofile.io"]
  node_wake_lock["Screen Wake Lock<br/>[app.js]"]
end

subgraph group_app_shell["App Shell"]
  node_pwa["PWA Install<br/>[manifest.json]"]
end

node_sender(("Sending User"))
node_receiver(("Receiving User"))

node_sender -->|"creates room"| node_room_ui
node_receiver -->|"joins room"| node_room_ui
node_room_ui -->|"registers or connects"| node_peerjs
node_room_ui -->|"shows pairing code"| node_qr_pairing
node_qr_pairing -->|"fills room code"| node_room_ui
node_peerjs -->|"signals handshake"| node_webrtc
node_webrtc -->|"establishes channel"| node_datachannel
node_file_transfer -->|"sends chunks"| node_datachannel
node_datachannel -->|"delivers chunks"| node_file_transfer
node_batch_transfer -->|"sends batch metadata"| node_datachannel
node_chat -->|"exchanges messages"| node_datachannel
node_file_transfer -->|"renders received media"| node_media_preview
node_sender -.->|"requests fallback share"| node_cloud_share
node_cloud_share -.->|"uploads file"| node_cloud_service
node_wake_lock -->|"keeps screen awake"| node_webrtc
node_receiver -->|"installs app"| node_pwa

click node_room_ui "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_qr_pairing "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_file_transfer "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_batch_transfer "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_chat "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_media_preview "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_cloud_share "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_wake_lock "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js"
click node_pwa "https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/manifest.json"

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_room_ui,node_qr_pairing,node_peerjs,node_sender,node_receiver toneBlue
class node_webrtc,node_datachannel,node_file_transfer,node_batch_transfer toneAmber
class node_chat,node_media_preview,node_cloud_share,node_cloud_service,node_wake_lock toneMint
class node_pwa toneRose
```

## Components

### Room Pairing

- [Room Controls](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- [QR Pairing](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- **PeerJS Signaling**

### Transfer Session

- **WebRTC Connection**
- **DataChannel**
- [Chunked File Transfer](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- [Batch Transfers](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`

### Session Features

- [In-session Chat](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- [Inline Previews](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- [Cloud Share](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`
- **gofile.io**
- [Screen Wake Lock](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/app.js): `app.js`

### App Shell

- [PWA Install](https://github.com/yunuseeeeeeee/yunze-transfer/blob/main/manifest.json): `manifest.json`

### Other components

- **Sending User**
- **Receiving User**

## Connections

- Sending User → Room Controls: creates room (evidence: `README.md`)
- Receiving User → Room Controls: joins room (evidence: `README.md`)
- Room Controls → PeerJS Signaling: registers or connects (evidence: `README.md`)
- Room Controls → QR Pairing: shows pairing code (evidence: `README.md`)
- QR Pairing → Room Controls: fills room code (evidence: `app.js`)
- PeerJS Signaling → WebRTC Connection: signals handshake (evidence: `README.md`)
- WebRTC Connection → DataChannel: establishes channel (evidence: `README.md`)
- Chunked File Transfer → DataChannel: sends chunks (evidence: `app.js`)
- DataChannel → Chunked File Transfer: delivers chunks (evidence: `README.md`)
- Batch Transfers → DataChannel: sends batch metadata (evidence: `app.js`)
- In-session Chat → DataChannel: exchanges messages (evidence: `README.md`)
- Chunked File Transfer → Inline Previews: renders received media (evidence: `README.md`)
- Sending User → Cloud Share: requests fallback share (evidence: `README.md`)
- Cloud Share → gofile.io: uploads file (evidence: `README.md`)
- Screen Wake Lock → WebRTC Connection: keeps screen awake (evidence: `app.js`)
- Receiving User → PWA Install: installs app (evidence: `README.md`)