After three years of ProseMirror, I replaced its view layer to get real pagination
说明与用途
QuireKit 替换 ProseMirror 的视图层,实现真实分页、IME 支持和多同步视图,同时保留原始文档模型和插件。
问题
ProseMirror’s contenteditable view cannot paginate like Word or Google Docs, making it hard to create page‑oriented documents.
结果
QuireKit delivers a true paged editor by replacing ProseMirror’s view layer, enabling incremental layout, accurate IME handling, and multiple synchronized views while preserving the original model and plugins.
工作流
- 1. Keep ProseMirror’s document model, plugins, and commands.
- 2. Replace EditorView with a custom view that renders pages via Canvas or SVG.
- 3. Implement recursive layout routines for body, paragraphs, tables, and cells to decide page breaks.
- 4. Use a temporary state during IME composition to avoid affecting undo history or collaboration.
- 5. Compute decorations against the temporary state to keep highlights correct.
- 6. Provide multiple views (paged, block, Markdown) sharing the same editor state.
- 7. Export the editor as an npm package and provide example code for initialization.
证据
The request I could never really deliver was "can it paginate like Word / Google Docs?"
ProseMirror splits an editor very cleanly: document model, transactions, plugins, commands, undo, input rules, keymaps and collaboration don't care how anything is displayed.
QuireKit keeps everything above that line and replaces the view.
During composition, layout and painting use a temporary state that is never dispatched, as if the preedit text were really in the document.
On a 1 MiB document, over 20 consecutive edits: new tree fragment visits 107,760 → 1,380 (−98.7%)
- 记录日期: 2026-11-02T03:28:49.896Z