一頁一頁的紙先被畫了出來：QuireKit 的編輯器，是一套被重做過的分頁介面

2026 年 10 月 27 日，開發者「king王一帥」在掘金發文，分享了過去四個月自研的成果：一套名為 QuireKit 的開源編輯器生態，底層是兩套編輯器框架，中間是自研排版引擎與多種視圖，最上層是分頁文件、塊編輯器、Markdown 編輯器等可直接使用的成品。整套框架以 MIT 授權開源，發文者自陳此前做了三年 ProseMirror。

先從首屏看起。打開演示頁，看到的是一頁一頁的紙，打字、換行、表格跨頁都是即時的。這個畫面本身就是一份設計宣言：瀏覽器原生只會排一條無限長的頁面，想要「一頁一頁的紙」，一般做法是排完再量高度、手動切頁，內容一改全亂。QuireKit 選了另一條路，斷行、分頁、遊標、選區全部自己算，再畫到 Canvas 或 SVG 上。螢幕上看到的分頁，就是列印出來的分頁。這個取捨的意義在於，介面與輸出第一次共用同一份排版事實，不存在「預覽與成品不一致」這個長期困擾線上文件的縫隙。

介面的豐富程度也是可指認的。發文者按 Word 的功能區逐項對過：開始、插入、頁面、引用、審閱、檢視，加上右鍵選單、格式設定面板、表格與圖片的上下文工具，宣稱已有 350 項以上功能能直接在介面上點出來用。350 這個數字當然是單方面的說法，未經獨立驗證，但對照 Word 功能區的結構去逐一補齊，本身就是一種介面設計方法：以使用者已經熟悉的後設介面為藍圖，降低遷移成本。

選區的處理則最能看出工程決策如何變成手感。用過 contenteditable 的人都遇過這個坑：選中一段字，去工具列輸個連結，選區就沒了。QuireKit 的遊標與選區是自己畫的，焦點跑到輸入框，選區照樣在。這是一個小到幾乎不被文件提到的細節，卻直接決定了編輯器用起來像原生應用還是像網頁。這與我們先前分析的QuireKit 瀏覽器文件編輯器的分頁排版思路一脈相承，兩篇合起來看，更能理解這套介面的整體設計。

Markdown 編輯器那邊則是另一種誠實。四種視圖，文件、即時預覽、源碼、閱讀，改的都是同一份 Markdown 原文，中間不經過 JSON 再轉回來，儲存時沒碰過的行一個字元都不變。發文者還給出實測數據：1 MiB 的文件連續輸入 20 次，語法樹訪問從 107,760 次降到 1,380 次，比較次數從 153,940 降到 660。「一個字元都不變」這個承諾，本質上是一種對使用者檔案的設計倫理：工具不該在你看不見的地方改寫你的原文。

值得注意的是授權邊界被畫得相當清楚。DOCX 往返與 PDF、OFD 匯出屬於商業 Word 元件，開發與評估免費；編輯器框架、排版引擎、編輯器本身與 UI 元件庫則是 MIT 開源。OFD 是中國的版式文件格式，多用於政務與公文場景，這個支援項目透露了這套工具預設的市場座標。

UI 元件庫是整套東西裡最有設計觀的一層。發文者為了讓分頁文件、塊編輯器、Markdown 編輯器與公式、白板、流程圖這些周邊編輯器「用起來是同一種手感」，單獨設計了一套基於 Vue 與 UnoCSS 的元件庫，顏色、間距、字號由同一套設計令牌管理，亮色與暗色主題一鍵切換，同樣 MIT 開源。這個決策背後的判斷是對的：編輯器的操作介面比一般後臺複雜得多，字體選單、顏色選擇、表格右鍵選單、縮放、快捷鍵提示，若各自為政，再強的排版引擎也會在手感上露出破綻。設計令牌在這裡的作用很具體，它讓「同一種手感」從形容詞變成可執行的約束。

發文者也坦承最難的一塊是 Canvas 上的中文輸入法，這是所有自繪文字介面共同的深水區，來源內文在此處截斷，後續細節不得而知。

整體看，QuireKit 的價值在於它把「瀏覽器裡做一個像 WPS、Google Docs 的編輯器」這件事拆成了可以被單獨取用的層：每一層可以單獨用，也可以整套組合。分頁是算出來的而非量出來的，選區是畫出來的而非瀏覽器給的，原文是儲存下來的而非轉換出來的，手感是令牌統一的而非各自湊合的。這些選擇沒有一個是炫技，每一個都對應一個具體的、被踩過的坑。至於 350 項功能與效能數據是否如宣稱，仍待更多獨立使用者的檢驗，但就介面設計的取捨而言，這套東西的優先順序排得很清楚：先讓紙是紙，再讓手感一致，最後才談生態。