Build a dashboard with AI

Most "real-time" dashboards don't need to be. The question to ask before architecting: how stale can the data be before a decision-maker notices? If the answer is "minutes," batch it. If the answer is "seconds," go real-time.

Batched (5-minute or hourly refresh). Right for SaaS revenue dashboards, marketing funnel reports, weekly business reviews. Implementation: a server-side route runs the aggregation queries, caches the result, the page refreshes on a timer. Simple to build, cheap to run, scales to thousands of users.

Real-time (sub-second). Right for ops dashboards watching production traffic, on-call alert views, live event monitoring. Implementation: Supabase Realtime channels push row changes to subscribed clients, or you poll a status endpoint every second. More expensive on Postgres connections; you'll want a connection pool. Webtwizz can scaffold either pattern; tell it which.

Hybrid. Most production dashboards. Top-line KPIs batch every 5 minutes. A single "live now" widget streams. Cheap on the database, snappy on the metric that matters.

The trap: defaulting to real-time everywhere. It's expensive and most users won't notice.

Recharts is the default in Webtwizz-generated dashboards. React-native, Tailwind-friendly, the right pick for 90% of cases. Bar, line, area, pie, composed charts: handles everything most business dashboards show.

Chart.js (via react-chartjs-2) is the right escape hatch when you need plot types Recharts doesn't have nativelyradar charts, polar area, mixed types with multiple Y-axes, or anything time-series-heavy with millions of points (Chart.js has better performance on large datasets).

Apache ECharts (via echarts-for-react) is the right call when you need genuinely advanced visualizations, sankey diagrams, treemaps, calendar heatmaps, geo-spatial. ECharts is heavy (~1MB gzipped) so don't pull it in unless you actually need the chart type.

Don't use D3 directly unless you're building a custom visualization that doesn't exist in any library. The build time tradeoff almost never wins.

Webtwizz scaffolds with Recharts by default; tell the AI "use ECharts for the geo map" or "use Chart.js for the time series" and it swaps the library on that one component without touching the rest.