MosswartOverlord/static/v2/index.html
Erik 85dce15d8b perf(v2): comprehensive performance optimizations
1. Map pan/zoom via direct DOM mutation (bypass React state)
   - txRef stores {scale, offX, offY}, applyTransform() writes
     directly to groupRef.style.transform
   - Zero React re-renders during pan/zoom — smooth 60fps
   - Removed MapTransformContext dependency (dead code now)

2. Code-split Recharts via React.lazy()
   - DashboardView (with all Recharts components) is a separate chunk
   - Main bundle: 274KB (was 694KB — 60% reduction)
   - Dashboard chunk: 425KB (loaded only on demand)
   - Map view loads instantly without Recharts overhead

3. useDeferredValue for player list
   - Kill counters, KPH, rares in sidebar use deferred rendering
   - React prioritizes map interactions over stat text updates
   - Reduces unnecessary re-renders during WS message bursts

4. useMemo for derived data in MapLayout
   - players array and vitalsMap memoized on characters ref
   - Prevents child component re-renders when Map identity changes
     but content is the same

5. Removed MapTransformProvider wrapper (no longer needed)

Total impact: ~60% smaller initial load, ~10x fewer re-renders
during active WebSocket streaming, zero-latency pan/zoom.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
2026-04-12 22:46:54 +02:00

14 lines
475 B
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Mosswart Overlord v2</title>
<link rel="icon" type="image/png" href="/icons/7735.png" />
<script type="module" crossorigin src="/v2/assets/index-BfimcakA.js"></script>
<link rel="stylesheet" crossorigin href="/v2/assets/index-DrsM2PEe.css">
</head>
<body>
<div id="root"></div>
</body>
</html>