PWA: SW network-first für HTML, sofortiger Reload bei Update; DevTools: JSON Viewer+Builder

frontend/src/main.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import ReactDOM from 'react-dom/client'
 import App from './App.jsx'
 
-// ── Auto-Reload bei neuem Build – nur beim Seitenwechsel ─────────────────────
+// ── Auto-Reload bei neuem Build ───────────────────────────────────────────────
 const STORED_KEY = 'dd_build_time';
 let newBuildAvailable = false;
 
@@ -15,7 +15,7 @@ async function checkBuildTime() {
       localStorage.setItem(STORED_KEY, buildTime);
     } else if (stored !== buildTime) {
       localStorage.setItem(STORED_KEY, buildTime);
-      newBuildAvailable = true; // merken, aber noch nicht reloaden
+      newBuildAvailable = true;
     }
   } catch {}
 }
@@ -32,17 +32,25 @@ export function reloadIfNewBuild() {
 // ── Service Worker ────────────────────────────────────────────────────────────
 if ('serviceWorker' in navigator) {
   navigator.serviceWorker.register('/sw.js').then(reg => {
-    if (reg.waiting) reg.waiting.postMessage('SKIP_WAITING');
+    // Falls schon ein wartender SW da ist → sofort aktivieren
+    if (reg.waiting) {
+      reg.waiting.postMessage('SKIP_WAITING');
+    }
+
     reg.addEventListener('updatefound', () => {
       const nw = reg.installing;
       nw?.addEventListener('statechange', () => {
-        if (nw.state === 'installed' && navigator.serviceWorker.controller) {
+        if (nw.state === 'installed') {
+          // Neuer SW installiert → sofort aktivieren
           nw.postMessage('SKIP_WAITING');
         }
       });
     });
+
+    // Wenn SW-Controller gewechselt hat → sofort neu laden
+    // (nicht erst beim nächsten Seitenwechsel warten)
     navigator.serviceWorker.addEventListener('controllerchange', () => {
-      newBuildAvailable = true; // SW-Update → beim nächsten Wechsel laden
+      window.location.reload();
     });
   });
 }