← Alle berichten

Markdown parsed where it is typed

DOM/markdown parses markdown in the browser. parse_markdown(src) returns HTML, which makes a live preview a two-line affair.

onExist('#editor', el => on('input', el, () => obj('#preview').innerHTML = parse_markdown(el.value)))

It exists because a preview is the one case where a round trip is genuinely wrong. Every other rendering job in Phlo belongs on the server: the server has the data, the escaping rules and the templates, and a route returning HTML through apply() is simpler than any client equivalent. But a preview updates on every keystroke, and no amount of server speed makes that the right shape.

It covers more than the marks people type in a comment: headings with anchors, bold, italic, code, links, lists, quotes, fenced blocks, tables and task lists. Server-side rendering of stored markdown stays a separate concern, which is where this site uses a PHP parser for its own posts.

The pairing worth noticing is with the fields layer. A wysiwyg field gives an editor that writes HTML; markdown plus a preview gives a plain textarea that stores text. For anything a user might later export, diff or edit somewhere else, the second one ages better.

Engine 1.0. See markdown in the manual.

We gebruiken essentiële cookies om deze site te laten werken. Met uw toestemming gebruiken we ook analytics om de site te verbeteren.