@ngx-runtime-monitor/dashboard
v0.1.1
Published
In-app developer overlay dashboard with dark/light themes, component tree inspection, and real-time leak diagnostics.
Maintainers
Readme
@ngx-runtime-monitor/dashboard
In-app developer overlay dashboard for Angular applications. Visualizes active resources, leak findings, component tree hierarchy, and heap snapshots in real time.
Features
- In-App Overlay: Hotkey (
Ctrl+Alt+M) or draggable floating action button (FAB). - Dark & Light Themes: Zero CSS pollution outside
#ng-runtime-monitor-root. - Component Hierarchy: Interactive tree showing active vs. destroyed components and surviving resources.
- Resource Table: Live virtual-scrolled inspection with durations and attribution.
- Detailed Findings: Actionable leak summaries with suggested fixes and clickable stack traces.
- Snapshot Comparison: Capture before-and-after snapshots to detect route transition leaks.
Installation
npm install @ngx-runtime-monitor/dashboard @ngx-runtime-monitor/core primeng primeiconsQuick Start
import { provideDashboard } from '@ngx-runtime-monitor/dashboard';
export const appConfig: ApplicationConfig = {
providers: [
provideDashboard(),
],
};License
MIT
