https://yennj12.js.org/yennj12_blog_V4/tags/ux/Recent content in UX on YennJ12 Engineering BlogHugo -- gohugo.ioen-usSat, 04 Jul 2026 13:00:00 +0800https://yennj12.js.org/yennj12_blog_V4/posts/auto-agent-system-part5-frontend-pipeline-zh/Sat, 04 Jul 2026 13:00:00 +0800https://yennj12.js.org/yennj12_blog_V4/posts/auto-agent-system-part5-frontend-pipeline-zh/後端做得再精巧,使用者感受到的只有兩件事: 「我按下去之後,看得到它在動嗎?」以及「這些任務能不能串起來自動接力?」 前者是即時進度串流,後者是 pipeline 編排。 這一篇——系列最終回——談的就是這條「從按鈕到體驗」的最後一哩路。 四篇走下來:架構(Part 1)、可靠性引擎(Part 2)、實戰任務(Part 3)、生產化(Part 4)。這些都是使用者看不見的底層。最後這一篇,我們談使用者唯一真正碰得到的東西:前端體驗,以及把任務串起來的 Pipeline。 一、即時進度串流:AI 任務為什麼非有它不可 先講「為什麼」。一個 AI 任務可能跑 30 秒到好幾分鐘。如果使用者按下「執行」後盯著一個沒有任何反應的畫面…… 沒有即時進度 ───────────────────────────── [執行] → (轉圈圈…30 秒…) → 使用者以為當機 → 重新整理 → 更慘 有即時進度 ───────────────────────────── [執行] → 「登入中…」→「掃描案件…」→「撰寫第 3 篇提案…」 → 「送出中…」→「完成 ✅」 使用者全程知道它活著、在做什麼、還要多久 對 AI 任務來說,即時進度不是體驗加分,是信任的基礎。因為任務久、又是黑箱,不給回饋,使用者就會焦慮、就會亂按。 這個系統用 SSE(Server-Sent Events) 解決,Part 1 提過機制,這裡完整拆開。 二、SSE 串流的完整運作:四個零件 ┌───────────────────────────────────────────────────────────┐ │ ① 背景任務寫 log │ │ Flow 執行中,每完成一小步就 append 一條 log 到 DB │ │ progress.