當任務越多、畫面越複雜，效能問題就會悄悄浮現，一開始我以為「快」的關鍵是寫更短的程式、或是加快事件處理，但今天才真正理解，程式變快的關鍵，其實是「少做一點」，在過去的版本裡，統計數據（例如全部、已完成、未完成、完成率）是分散在不同元件裡各自計算的，有的寫在 Home.vue，有的又藏在 TaskList.vue，結果只要任務一多，每個 watch、每個重新渲染都會被觸發，看似正常，其實系統一直在「重複算重複的事」，今天的重點，就是讓這些重複運算回歸中心，我把所有推導型資料都放進 useTasks.js，用 Vue 的 computed 重新包裝，讓所有元件都能直接讀取最新結果，而不用各算各的，TaskList 專心處理 UI，StatsBar 專心顯示數字，真正做到邏輯分離。

接著，我也整理 watch，以前為了存檔，在不同地方都寫了 watch(tasks, _save)，結果任何一點變化都會引發多重觸發，這次我改成只保留一個 watch，加上 debounce，讓它在短時間內多次操作時只執行一次，這讓整個應用更安靜、穩定，資料依然安全保存，但效能明顯更順暢，新增任務時只看到一個 新節點被渲染，勾選完成只更新那一列，刪除則自動收縮，其他都沒被動到，畫面不再閃、不再整體重繪，那一刻，我真的看見 computed 的力量，它不是魔法，而是幫我省下所有不必要的動作，這天的學習讓我深刻體會「少即是多」的哲學，寫程式不是堆砌邏輯，而是學會讓系統自己推導，重構後的專案更乾淨、更穩定，也更像一個真正的系統，每個元件只負責自己的角色，而整體卻流暢運作。Vue 的 computed 就像一個聰明的店員，只在貨品變動時更新價格，而不是每秒重新盤點整個倉庫，這就是「高效」的本質，期待明天的文章吧！