Report Generation Monitoring Dashboard)

Avatar of 王治程.
Avatar of 王治程.

Report Generation Monitoring Dashboard)

AI 原生開發者
Tainan City, Taiwan

【可觀測性實踐】Report Monitoring Dashboard:具備狀態機保護的非同步任務監控系統


引言

大多數 CLI 任務執行時如同進入黑箱。本專案透過 React 與 FastAPI,將枯燥的後台 Batch 任務轉化為「可觀測、可控制」的監控系統。我將硬核後端狀態機邏輯引入 UI,確保監控面板不只是美觀,更是數據一致的真理來源。
「這是我初次嘗試 GUI 開發,但我堅持將 『後端狀態機的確定性』 延伸至 UI 層。這不只是一個面板,而是對複雜非同步任務(Asynchronous Tasks)可觀測性的一場實驗。」 專案佈局:採用 Dashboard-as-a-Service 邏輯,分離『靜態定義區』與『動態觀察區』,最大化操作員在緊急故障排除(Troubleshooting)時的情境覺知。」 🏗️ 系統架構與設計靈魂 (Engineering Depth)強型別狀態機控制 (Strict State Machine):不僅在後端定義,更在前端實作狀態轉移規則(Queued → Running → Success/Failed/Cancelled)。禁止非法狀態跳轉,確保 UI 呈現的每一秒都具備邏輯正確性。 非同步任務與 UI Polling 優化:使用 FastAPI BackgroundTasks 處理非同步計算,並在前端實作具備「資源意識」的 Polling 機制:當進入終止狀態(Terminal State)時自動停止更新,節省系統資源。 Thread-Safe 資料管理:在後端實作 threading.Lock 保護共享的 In-memory data store,確保多併發存取下的 Logs 與 Job 狀態絕對同步。 核心觀測功能 (Observability Features)Live Log Streamer:實作具備「自動捲動」與「等級過濾(INFO/WARN/ERR)」功能的 Log Viewer,將任務執行細節即時推送到操作員眼前。 Job 生命週期管理:支援任務手動觸發與「中途取消(Cancellation)」。我特別處理 Cancellation 流程中的資源清理,杜絕分散式系統中最常見的『孤兒進程』問題,保證系統資源的潔淨(Cleanup Excellence)。」 介面設計原則 (Operational Design)「好的 UI 應該幫助操作員減少認知負擔。」 佈局策略:左側 Job 清單定位、右側 Run 詳情與即時 Logs。清楚分離「操作區」與「觀察區」,讓複雜的任務流程一目瞭然。 「本專案不盲目追求框架潮流,而是實踐了 Domain-Driven Design (DDD) 的核心理念。透過 Service 與 Repository 的嚴謹分層,我確保了系統具備抗風險的靈活性。 「不盲目追求複雜狀態管理庫(如 Redux),而是回歸 RESTful 狀態對齊。透過嚴謹的 Service/Repository 分層,實現了真正的職責分離。」
Avatar of the user.
请先登入再留言。

发布时间: 2026年4月2日
90
0
0

工具

python
Python

python
FastAPI
React

分享