Code Editor
A lightweight source-code editor built on CodeMirror 6 — much smaller download than Monaco (≈150KB core + on-demand language packs vs. Monaco's 5MB WASM bundle), with the same essentials: syntax highlighting, line numbers, bracket matching, autocomplete, history, and search.
Why CodeMirror, not Monaco? Monaco's WebAssembly + worker bundle weighs ~5MB —
awkward on static hosts (Cloudflare Pages caps single assets at 25MB and you stack up fast).
CodeMirror 6 is modular ESM: a tiny core plus per-language packs (5–30KB each) that are
dynamic-imported only when needed. A page that only edits JSON pays 150KB + ~10KB; a page
that edits Python pays for the Python pack, not the C# one.
When to Use
- Inline source-code editing — JSON config blobs, SQL snippets, code samples, Markdown drafts
- Admin surfaces that need a code field but don't want a full IDE-sized download
- Documentation pages with editable, runnable examples
- Anywhere a
<Textarea>is too primitive but Monaco is too heavy
JavaScript
TypeScript
Current length: 20 characters