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%)

Источник