feat: image optimization — client-side resize + server-side thumbnails

Avatars/banners now resize to max 512px/1920px and convert to WebP before
upload (zero server cost). Chat image uploads generate an 800px-wide WebP
thumbnail via Sharp; the feed shows the thumbnail, click opens the full-res
original. Adds lazy loading to avatars. Federation-compatible: remote
instances without this feature fall back gracefully.
This commit is contained in:
Jannis Braun
2026-03-13 16:44:14 +01:00
parent 12b450b7b9
commit 3e97c2b0f5
19 changed files with 449 additions and 20 deletions
@@ -105,6 +105,7 @@ export function Avatar({ src, name, size = 40, status, className = '', onClick,
src={(src.startsWith('http') || src.startsWith('blob:') || src.startsWith('data:'))
? src : `/api/uploads/${src}`}
alt={name}
loading="lazy"
className="w-full h-full rounded-full object-cover"
onError={(e) => {
(e.target as HTMLImageElement).style.display = 'none';