Realtime analyticsPro

• Live counter
• Per-second bars
• Event feed
• Top pages race

• Launch days, live events and ops dashboards.

• Historical reporting: use the metrics dashboard.

Import it from @/components/blocks/realtime-analytics after installing. It ships with sample data, so it renders straight away; swap in your own data when you're ready.

import { RealtimeAnalytics } from "@/components/blocks/realtime-analytics";

export default function Page() {
  return (
    <main className="mx-auto max-w-6xl p-6">
      <RealtimeAnalytics />
    </main>
  );
}

• The bar stream is an image with a description; the feed isn't announced (too chatty) but can be paused.

• Bars shift left each second; the newest is highlighted; feed items spring in; pages reorder as counts change.

• The feed moves under the counter below 1024px.

• One interval drives everything and stops when paused or unmounted.

• Feed it from a WebSocket and batch updates to about once a second.