59 lines
2.6 KiB
Markdown
59 lines
2.6 KiB
Markdown
# Whiteboard URL-Referenzen
|
||
|
||
> **Ziel:** Nextcloud Whiteboard von Base64-Bildern auf URL-Referenzen umstellen — 50+ Bilder ohne Browser-OOM.
|
||
|
||
## Problem
|
||
|
||
Das Nextcloud Whiteboard (Excalidraw) speichert jedes importierte Bild als Base64-Data-URL inline im Board-JSON. Ein 4000×3000px Bild belegt ~50 MB RAM. Ab 3 Bildern crasht Chrome mit Out-of-Memory.
|
||
|
||
## Lösung
|
||
|
||
Statt Base64 wird das Bild als Datei in Nextcloud gespeichert. Im Board-JSON steht nur eine URL. Der Browser lädt Vollbilder nur bei Bedarf (lazy, beim Reinzoomen) — ähnlich wie Miro.
|
||
|
||
## Projektstruktur
|
||
|
||
```
|
||
whiteboard-url-refs/
|
||
├── README.md
|
||
├── docs/
|
||
│ ├── 01-reference.md ← Recap aller bestehenden Patches
|
||
│ └── 02-implementierungsplan.md ← 4-Phasen-Plan + 23 Test-Gates
|
||
├── src/
|
||
│ ├── README.md ← Source-Herkunft dokumentiert
|
||
│ ├── whiteboard-source/ ← TypeScript-Source (aus upstream)
|
||
│ │ ├── hooks/useFiles.ts ← 🔑 File-Handler (hier dataURL→URL)
|
||
│ │ ├── constants/excalidraw.ts ← Excalidraw Init-State
|
||
│ │ ├── main.ts ← Entry Point
|
||
│ │ └── vite.config.ts ← Build-Config
|
||
│ └── whiteboard-built/ ← Live JS-Bundles (gepatcht)
|
||
│ ├── NcSelect-*.chunk.mjs ← Whiteboard→Excalidraw Bridge
|
||
│ ├── percentages-*.chunk.mjs ← Excalidraw Core Constants
|
||
│ ├── image-blob-reduce-*.mjs ← Resize-Library
|
||
│ └── whiteboard-*-patch.js ← Unsere bestehenden Patches
|
||
├── upstream/
|
||
│ └── excalidraw/
|
||
│ └── constants.ts ← DEFAULT_IMAGE_OPTIONS (1440px/4MB)
|
||
├── patches/ ← (kommende JS-Patches)
|
||
└── test-scripts/
|
||
├── generate-test-images.sh ← Testbilder 500–8000px
|
||
└── verify-phase1.sh ← CORS + WebDAV prüfen
|
||
```
|
||
|
||
## Phasen
|
||
|
||
| Phase | Beschreibung | Status |
|
||
|---|---|---|
|
||
| **0** | Baseline: RAM messen, bestehende Patches verifizieren | ⬜ |
|
||
| **1** | CORS + WebDAV: Ordner anlegen, Cross-Origin erlauben | ⬜ |
|
||
| **2** | Import-Handler: Bild als Datei speichern, Thumbnail generieren | ⬜ |
|
||
| **3** | Rendering/LOD: Lazy-Loading, Viewport-Culling | ⬜ |
|
||
| **4** | Migration: Bestehende Boards konvertieren, Stress-Test | ⬜ |
|
||
|
||
Jede Phase hat ein **🚦 GATE** — alle Checks müssen grün sein, bevor die nächste beginnt.
|
||
|
||
## Setup
|
||
|
||
```bash
|
||
git clone http://192.168.178.94:3000/Hermes/whiteboard-url-refs.git
|
||
```
|