Canary Watch — 部署後監控 是做什麼的?
使用時機
- 部署到正式環境或暫存環境後
- 合併高風險 Pull Request 後
- 想要驗證修復是否真的解決問題時
- 在發佈窗口期間進行持續監控
- 依賴升級之後
運作方式
監控已部署 URL 是否發生回歸。會持續循環執行,直到手動停止或監控視窗到期為止。
監控項目
1. HTTP 狀態 — 頁面是否回傳 200?
2. 主控台錯誤 — 是否出現之前沒有的新錯誤?
3. 網路失敗 — API 呼叫失敗、5xx 回應?
4. 效能 — LCP/CLS/INP 是否相較基線出現回歸?
5. 內容 — 關鍵元素是否消失?(h1、導航列、頁尾、CTA)
6. API 健康 — 關鍵端點是否在 SLA 時間內回應?
7. 靜態資源 — JS、CSS、圖片和字型請求是否回傳 2xx/3xx 且內容類型符合預期?
8. SSE 串流 — event-stream 端點是否能連線並接收到初始事件或心跳?
監控模式
快速檢查(預設):單次執行,回報結果
/canary-watch https://myapp.com
長時間監控:每 N 分鐘檢查一次,持續 M 小時
/canary-watch https://myapp.com --interval 5m --duration 2h
差異模式:比較暫存環境與正式環境
/canary-watch --compare https://staging.myapp.com https://myapp.com
警示閾值
critical: # 立即警示
- HTTP 狀態不等於 200
- 主控台錯誤數 > 5(僅限新錯誤)
- LCP > 4 秒
- API 端點回傳 5xx
- 靜態資源回傳 4xx/5xx
- SSE 端點無法連線或收到第一次心跳前即斷線
warning: # 報告中標記
- LCP 相較基線增加超過 500 毫秒
- CLS > 0.1
- 新的主控台警告
- 回應時間超過基線的 2 倍
- 靜態資源內容類型意外改變
- SSE 心跳延遲超過基線的 2 倍
info: # 僅記錄
- 輕微效能變異
- 新的網路請求(第三方腳本加入?)
通知方式
當觸發臨界閾值時:
- 桌面通知(macOS/Linux)
- 可選:Slack/Discord Webhook
- 記錄至
~/.claude/canary-watch.log
輸出範例
## Canary Report — myapp.com — 2026-03-23 03:15 PST
### 狀態:健康 ✓
| 檢查項目 | 結果 | 基線 | 差異 |
|-------|--------|----------|-------|
| HTTP | 200 ✓ | 200 | — |
| 主控台錯誤 | 0 ✓ | 0 | — |
| LCP | 1.8s ✓ | 1.6s | +200ms |
| CLS | 0.01 ✓ | 0.01 | — |
| API /health | 145ms ✓ | 120ms | +25ms |
| 靜態資源 | 42/42 ✓ | 42/42 | — |
| SSE /events | 已連線 ✓ | 已連線 | +80ms 心跳 |
### 未檢測到回歸。部署狀態乾淨。
整合
搭配使用:
/browser-qa進行部署前驗證- 鉤子:在
git push時新增為 PostToolUse 鉤子,部署後自動檢查 - CI:在 GitHub Actions 中部署步驟後執行