{
  "id": 16909396,
  "title": "After three years of ProseMirror, I replaced its view layer to get real pagination",
  "url": "https://urgent.news/2026/10/28/after-three-years-of-prosemirror-i-replaced-its-view-layer-to-get",
  "topic": "tech",
  "section": "Tech",
  "published": "2026-10-28T14:22:40.000Z",
  "source": {
    "name": "Dev.to",
    "slug": "dev-to",
    "url": "https://dev.to/kingshuaishuai/after-three-years-of-prosemirror-i-replaced-its-view-layer-to-get-real-pagination-5fc8"
  },
  "original_language": "en",
  "account": "After three years of using ProseMirror, the author replaced its view layer to enable real pagination. ProseMirror splits an editor cleanly, but the view layer is tied to contenteditable. The author built QuireKit, an MIT-licensed open-source product, to get pagination like Word or Google Docs. The browser lays out content like a single endless page, but it has no understanding of page breaks, paragraph breaks, or page numbers. The usual approach is to let the browser lay out, measure heights, and cut the result into pages after. This works for a demo but becomes problematic when content changes, requiring re-measurement and re-cutting, and caret and selection need to follow the fake page structure. The author kept ProseMirror and replaced the view layer, using the same editor API as Tiptap. QuireKit has three views of the same editor state, sharing extensions, commands, and plugins. The paged editor handles layout and pagination itself, with one recursive routine for every container type. Layout turns into a list of drawing commands that can paint on Canvas 2D or SVG. The engine only knows how to lay things out, so document profiles define how to lay out different types of documents. The author faced challenges with IME input on a canvas, which required a hidden input proxy and a special state machine. The editor can handle selections that survive losing focus, making it more user-friendly. The Markdown side uses CodeMirror and Lezer, with the Markdown text itself being the document. The source-first approach means re-parsing on every keystroke, but the author added incremental parse proofs to optimize performance.",
  "summary": "Open https://quirekit.com and the first thing you see is not a screenshot. It's an editor with actual pages: type, press Enter, watch a table split across a page break, switch between Canvas and SVG rendering. All live. I've been building ProseMirror-based products for three years. The request I could never really deliver was \"can it paginate like Word / Google Docs?\" In June I gave up on working…",
  "key_points": [
    "Author replaced ProseMirror view layer for real pagination",
    "QuireKit, MIT-licensed open-source product, enables pagination",
    "Paged editor handles layout and pagination itself"
  ],
  "editors_take": null,
  "illustration": null,
  "coverage": {
    "outlets": 1,
    "also_reported_by": []
  },
  "ai_generated": true,
  "disclaimer": "Summaries, key points and the editor’s take are written by software from other outlets’ reporting and may contain errors — always check the linked original."
}