Developer Inspector HUD
On-screen debug panel for inspecting live cache hit rates and resolution latency.
Overview
Render DriveDebugOverlay anywhere in your app to get a real-time, in-app dashboard showing live candidate probes, cache hits, and performance telemetry.
Code Example
debug-hud.tsx
| 1 | import { DriveDebugOverlay } from '@driveloader/react'; |
| 2 | |
| 3 | export function App() { |
| 4 | return ( |
| 5 | <main> |
| 6 | <YourAppContent /> |
| 7 | {process.env.NODE_ENV === 'development' && <DriveDebugOverlay />} |
| 8 | </main> |
| 9 | ); |
| 10 | } |
Common Mistakes
- ×Leaving DriveDebugOverlay active in production builds (always wrap in process.env.NODE_ENV check).