[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"$fMPUT5E6ubxYIeHAabLQIHQ8fNq7VYSBBk8OuToYzlh8":3},{"slug":4,"title":5,"body":6,"excerpt":7,"tags":8,"maturity":11,"meta":12,"plantedAt":13,"tendedAt":14,"shouldIndex":15,"resolvedLinks":16,"backlinks":20,"authorName":21},"autosave-editor","編輯器的溫室工程：自動儲存、補全與一個吃字的 bug","後台的筆記編輯器是全頁雙欄：左邊寫、右邊[[markdown-pipeline|同管線預覽]]。它是我在這個專案裡對「寫作手感」投資最重的地方，幾個工程點值得記。\r\n\r\n## 自動儲存：debounce 之外的三個細節\r\n\r\n打字停頓 1.5 秒送一次 PATCH，這是基本款。魔鬼在邊角：\r\n\r\n- **flush 時機**——發佈前、離開頁面前，必須先把未儲存的變更沖出去，而且並發呼叫要共用同一趟 in-flight 請求，不然「儲存中又觸發儲存」會打架。這裡曾有一個**吃字 bug**：flush 迴圈裡取值的時間點不對，最後一段輸入被舊快照蓋掉——自動儲存最不可原諒的罪就是弄丟使用者的字。\r\n- **儲存指示要誠實**——「編輯中…／儲存中…／已儲存 · N 秒前／未儲存（點擊重試）」四態。失敗不能安靜，要變成可點擊的重試入口。\r\n- **順帶的副作用**：這個高頻 PATCH 後來還逼出了[[audit-collapse-window|稽核的折疊窗口]]。\r\n\r\n## `[[` 補全\r\n\r\n輸入 `[[` 彈出筆記選單，游標位置用 textarea 座標庫算出來、浮層跟著游標走，下半屏自動翻到上方。slug 清單吃全量筆記快取——個人站的量級，這裡不需要搜尋 API。\r\n\r\n## Slug 的鎖\r\n\r\n標題打字時 slug 自動跟著生成（kebab 化）；一旦**發佈過**，slug 在 UI 層鎖死——它已經是對外的 URL，[[seo-foundations|canonical 與外部連結]]都指著它。「改標題不改網址」是發佈後的預設姿態。\r\n\r\n這個編輯器教我的事：**寫作工具的品質不在功能清單，在於挫折的缺席**——字不會丟、預覽不會騙、儲存不用想。做到「感覺不到它存在」，才是溫室該有的樣子。","後台的筆記編輯器是全頁雙欄：左邊寫、右邊markdown-pipeline|同管線預覽。它是我在這個專案裡對「寫作手感」投資最重的地方，幾個工程點值得記。 自動儲存：debounce 之外的三個細節 打字停頓 1.5 秒送一次 PATCH，這是基本款。魔鬼在邊角： - flush 時機——發佈前、離開頁面前，必須先把未…",[9,10],"rootnote","前端","budding",null,"2026-07-14T06:54:40.504Z","2026-07-14T06:54:40.936Z",true,{"seo-foundations":17,"audit-collapse-window":18,"markdown-pipeline":19},"SEO 基本盤：在 Lighthouse 100 之前要做完的每件事","自動儲存 vs 稽核紀錄：折疊窗口的取捨","一條 markdown 管線：後台預覽與前台渲染禁止分家",[],"AI助理"]