[Suggestion]: reactivity in node-level diffing for createParse()

[arashsheyda]

Description

when rendering Comark in a framework (Vue, React, Svelte), every call to parse() produces an entirely new AST. framework renderers see all-new object references and re-render the entire document tree, even if only a single character changed in one paragraph

This is costly for:

• Streaming/AI chat: tokens arrive rapidly but only the last node is actively changing
• Live editors: users edit one section while the rest is static
• Expensive plugins: syntax highlighting and math rendering run on every node, every time

Proposal

add automatic node-level diffing to createParse() when the returned parser is called multiple times, it compares the new AST against the previous result and preserves === object references for structurally unchanged nodes

const parse = createParse()

const tree1 = await parse('# Hello\n\nWorld')
const tree2 = await parse('# Hello\n\nWorld!!')

tree2.nodes[0] === tree1.nodes[0]  // true — heading unchanged
tree2.nodes[1] === tree1.nodes[1]  // false — paragraph changed

framework renderers can then skip re-rendering nodes whose reference didn't change with zero API changes for consumers. here's a video of react example with react-scan (look at the AST section)

Before

Screen.Recording.2026-04-16.at.8.50.44.PM.mov

After

Screen.Recording.2026-04-16.at.8.57.31.PM.mov

[farnabaz]

There is such feature in the streaming mode. When you pass { streaming: true } to the parse function, parser will keep the latest result and try to optimize parsing.
This will happen only if the first input is a prefix of next input. on this situation, parser will try to extract previously parsed complete block and reuse their node and prevent from parsing again.

As result, streaming is faster and more memory efficient.

Try this.

import { createParse } from "./src"

const parse = createParse()

const tree1 = await parse('# Hello\n\nWorld')

const tree2 = await parse('# Hello\n\nWorld!!')

console.log(tree2.nodes[0] === tree1.nodes[0])  // true — heading unchanged

console.log(tree2.nodes[1] === tree1.nodes[1])  // false — paragraph changed

console.log('Now with streaming')

const parse2 = createParse()

const tree21 = await parse2('# Hello\n\nWorld', { streaming : true })

const tree22 = await parse2('# Hello\n\nWorld!!', { streaming : true })

console.log(tree22.nodes[0] === tree21.nodes[0])  // true — heading unchanged

console.log(tree22.nodes[1] === tree21.nodes[1])  // false — paragraph changed

[atinux]

I think it could be nice to document this for some kind of parsing with hoisting? (not sure if this is the right name :D )