Fix: Friends-Avatare wieder Original-URL (kein Preview), SW by-v1111

User-Report: trotz onerror-Fallback weiter Fragezeichen.

Ursache: Das _preview.webp-System wurde damals nur konsequent für
Diary-Uploads ausgerollt. User-Avatare und Hund-Profilbilder haben
keine Preview-Variante → 404 vom _preview triggert kurz das
Browser-Default-Broken-Image-Icon BEVOR der onerror-Fallback das
Original lädt (Race-Condition).

Pragmatischer Fix: Preview-System in friends.js rückgebaut. Bilder
werden direkt mit Original-URL geladen. Performance kommt durch:
- loading=\"lazy\" (off-screen Bilder erst beim Scrollen)
- decoding=\"async\" (Main-Thread bleibt frei)
- onerror=\"this.style.display='none'\" (kaputte Bilder verschwinden
  statt Fragezeichen zu zeigen)

UI.previewUrl + UI.previewFallback bleiben als Helper verfügbar
für später falls das Preview-System app-weit ausgerollt wird.
This commit is contained in:
rene 2026-05-27 09:25:19 +02:00
parent 8e75e2b1a7
commit 2d98eb9374
6 changed files with 27 additions and 28 deletions

View file

@ -86,14 +86,14 @@
<title>Ban Yaro</title>
<!-- Theme + theme-color Statusleiste vor CSS setzen -->
<script src="/js/boot-early.js?v=1110"></script>
<script src="/js/boot-early.js?v=1111"></script>
<!-- CSS: Reihenfolge ist wichtig — ?v= zwingt Browser zur Neuladung -->
<link rel="stylesheet" href="/css/design-system.css?v=1110">
<link rel="stylesheet" href="/css/layout.css?v=1110">
<link rel="stylesheet" href="/css/components.css?v=1110">
<link rel="stylesheet" href="/css/utilities.css?v=1110">
<link rel="stylesheet" href="/css/lists.css?v=1110">
<link rel="stylesheet" href="/css/design-system.css?v=1111">
<link rel="stylesheet" href="/css/layout.css?v=1111">
<link rel="stylesheet" href="/css/components.css?v=1111">
<link rel="stylesheet" href="/css/utilities.css?v=1111">
<link rel="stylesheet" href="/css/lists.css?v=1111">
</head>
<body>
@ -617,11 +617,11 @@
<div id="modal-container"></div>
<!-- JS: Reihenfolge ist wichtig — erst Basis, dann Features -->
<script src="/js/api.js?v=1110"></script>
<script src="/js/ui.js?v=1110"></script>
<script src="/js/app.js?v=1110"></script>
<script src="/js/worlds.js?v=1110"></script>
<script src="/js/offline-indicator.js?v=1110"></script>
<script src="/js/api.js?v=1111"></script>
<script src="/js/ui.js?v=1111"></script>
<script src="/js/app.js?v=1111"></script>
<script src="/js/worlds.js?v=1111"></script>
<script src="/js/offline-indicator.js?v=1111"></script>
<!-- Feature-Seiten werden lazy geladen -->
@ -631,7 +631,7 @@
<!-- Boot: Offline-Banner + SW-Registration (extrahiert für CSP) -->
<script src="/js/boot.js?v=1110"></script>
<script src="/js/boot.js?v=1111"></script>
</body>