实时仪表板与指标

会自己更新的图表与计数器，页面一打开就显示最新数值，不必让每个打开的仪表板去轮询。

管理后台、销售仪表板、监控画面、股票或加密货币报价，只有数字是最新的才有用。每分钟刷新一次，代表大家根据旧数据做决定；让每个开着的仪表板去轮询 API，成本也远高于把一次更新推给所有人。

用户得到什么

订单、注册或读数一进来，图表与计数器就自己动起来。
页面一打开就看到最新数值，不会在下次更新前一片空白。
挂在墙上的屏幕整天保持实时，不必重新加载。

用到的功能

缓存频道（cache-、private-cache-），保留最后一个事件 30 分钟，并立刻交给每位新订阅者。
批量 API（triggerBatch），一次请求送出多项指标。
免费扇出：不论有十个人还是一万个人在看，一次发布的更新都只算一条消息。
cache_miss webhook，在新观看者发现没有缓存时通知你的服务器。

步骤 1：从后端发布指标

数字有变化时送出更新；变化很快的数字则用短间隔定时送。把多个频道合成一个批量，只要一次 HTTP 调用：

setInterval(async () => {
  const stats = await metrics.snapshot();
  await pusher.triggerBatch([
    { channel: 'private-cache-dash-sales', name: 'update', data: { revenue: stats.revenue, orders: stats.orders } },
    { channel: 'private-cache-dash-signups', name: 'update', data: { today: stats.signups } },
  ]);
}, 5000);

批量里的每个频道各算一条消息，所以两个区块每 5 秒更新一次，一天大约是 35,000 条消息。只在数字改变时才送，就能用得更少。

步骤 2：在仪表板里订阅

const sales = pusher.subscribe('private-cache-dash-sales');
sales.bind('update', ({ revenue, orders }) => {
  revenueTile.set(revenue);
  ordersChart.push(orders);
});

// Nothing published in the last 30 minutes: load the value from your API once
sales.bind('pusher:cache_miss', async () => {
  revenueTile.set(await fetch('/api/stats/revenue').then((r) => r.json()));
});

private- 前缀代表由你的授权路由决定谁能看每个仪表板，例如只限员工，或只限该账号所属的客户。

步骤 3：有人进来时补上缓存

让 webhook 端点订阅 cache_miss，当观看者打开一个没有缓存的仪表板时，发布目前的数值。之后的每位观看者都直接从缓存拿到：

for (const e of webhook.getEvents()) {
  if (e.name === 'cache_miss' && e.channel === 'private-cache-dash-sales') {
    const s = await metrics.snapshot();
    await pusher.trigger(e.channel, 'update', { revenue: s.revenue, orders: s.orders });
  }
}

小提醒

每个区块或每位客户用一个频道，不要全部塞进同一个频道：观看者只会收到自己在看的内容。
传数字，不要传渲染好的 HTML，每次更新保持在 10 KB 以下（Free 方案为 4 KB）。
给客户看的仪表板（例如你 SaaS 里的分析页）做法相同，每个账号一个频道：private-cache-account-123-usage。
调整间隔时，可以在 portal 的应用页面实时查看自己的消息数与连接数。