# Frontend Performance Audit

## Issues Identified

### 1. Exponential Timer Stacking (Fixed)
The `useCommandApiStatus.js` hook, which performs health checks, maintained a 5000ms `setInterval`. When a check failed, it spawned a recursive `setTimeout` for backoff logic, but *failed to clear the underlying interval*. This created O(N) concurrent timers, drastically hurting main thread performance and saturating the browser's network task queue during outages.

### 2. High Frequency DOM & State Updates
Components like `AlertFeed.jsx` and `GossipGraph.jsx` trigger state updates at sub-second frequencies (`400ms` and `1500ms`). 
- Uncoordinated background tasks processing WebSocket frames and polling can cause continuous React re-renders.
- Unmounted components were retaining active `setTimeout` callbacks, resulting in zombie state updates causing layout thrashing and memory leaks.

### 3. Redundant Fetch Requests
- `EmergencyPage.jsx` has multiple `setInterval` hooks (5s and 10s) pulling entire datasets (`/issues`, `/emergency/dispatch-log`, `/staff/activity`). Combined with WebSocket events, this is redundant and wastes client/server bandwidth.

## Recommendations
- **Debounce State Updates**: Batch WebSocket events or throttle high-frequency data (like bounding boxes or presence updates) to 1-2 FPS for the UI unless critically needed for rendering.
- **Cleanup Background Intervals**: Ensure strict React lifecycle management for any timers (like `setTimeout`) spawned indirectly by `setInterval` functions to prevent memory leaks and zombie updates.