docs: document in-app navigation persistence (no transfer interruption)

- README.md / README.zh-CN.md:
      - Add feature bullet for in-app navigation persistence (same-tab SPA)
      - Note boundaries: refresh/tab close/new tab not covered
  - Frontend architecture (zh/en):
      - Add “State & Connection Lifecycle (In-App Navigation)” section
      - Explain Zustand store singleton and webrtcService singleton across routes
      - Guidance: avoid leaveRoom()/store reset on route-change side effects
  - System architecture (zh/en):
      - Add “Runtime Session Model (Frontend)” summary
  - AI Playbook:
      - flows.zh-CN.md: add UX optimization item for in-app navigation persistence and debugging notes
      - code-map.zh-CN.md: mark webrtcService and fileTransferStore as singletons (cross-route)
This commit is contained in:
david_bai
2025-11-24 15:06:10 +08:00
parent 89a38936b6
commit 10f236dc8d
9 changed files with 34 additions and 3 deletions
+8
View File
@@ -135,6 +135,14 @@ Benefits:
- **Automatic Detection**: `middleware.ts` intercepts requests and automatically redirects to the appropriate language path based on the `Accept-Language` header or a cookie.
- **Dynamic Loading**: The `getDictionary` function in `lib/dictionary.ts` asynchronously loads the corresponding `messages/*.json` file based on the `lang` parameter, enabling code splitting.
### 3.4 State & Connection Lifecycle (In-App Navigation)
- **Singleton Store (Zustand)**: `frontend/stores/fileTransferStore.ts` is a module-level singleton, preserving in-memory state across routes (e.g., share content, files to send, received files/meta, progress states).
- **Singleton Connection Service (webrtcService)**: `frontend/lib/webrtcService.ts` holds `RTCPeerConnection`/`RTCDataChannel` and FileSender/FileReceiver as a singleton. App Router page switches do not tear it down.
- **Effect**: In the same browser tab, in-app navigation (App Router page switches) does not interrupt ongoing transfers, and selected/received content remains intact.
- **Boundary**: Page refresh/closing the tab or opening in a new tab is not covered; when changing layout hierarchy/SSR behavior, avoid cleaning the connection in layout unmount.
- **Note**: Do not call `webrtcService.leaveRoom()` or reset the global Store inside route-change side effects; only do so on explicit user actions.
## 4. Summary and Outlook
The current frontend architecture successfully deconstructs a complex WebRTC application into a series of clean, maintainable modules through layered design and Hook-centric logic encapsulation. The boundaries between UI, business logic, and underlying libraries are clear, laying a solid foundation for future feature expansion and maintenance.