Files

59 lines
2.6 KiB
Markdown
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
# 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 5008000px
└── 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
```