Редактор Markdown
Пишите слева, смотрите отрендеренный результат справа. Синхронная прокрутка, панель форматирования и экспорт в Markdown или HTML по завершении.
Как это работает
Предпросмотр рендерится библиотекой marked — open-source парсером Markdown, встроенным прямо в этот сайт (без какого-либо CDN), настроенным на GitHub Flavored Markdown с включёнными переносами строк. Он заново разбирает весь документ при каждом нажатии клавиши; звучит расточительно, но marked компилируется в один быстрый проход, и даже документы размером с книгу рендерятся за считаные миллисекунды. Редактор также ведёт собственную историю отмены на до 100 снимков, потому что кнопки панели инструментов программно меняют значение textarea, что незаметно обходит нативный стек отмены браузера. Последовательный набор текста объединяется в один шаг после короткой паузы, поэтому Ctrl+Z откатывает по правкам, а не по нажатиям клавиш.
Синхронизация прокрутки между панелями пропорциональна: позиция прокрутки каждой панели переводится в соотношение от 0 до 1 и отражается на другой стороне. Заметка о переносимости: при включённых переносах строк одиночный перенос строки становится настоящим разрывом строки — так же, как GitHub рендерит комментарии. Строгие рендереры CommonMark, включая многие генераторы статических сайтов, вместо этого объединят такие строки в один абзац. Если ваш Markdown направляется куда-то со строгими правилами, завершайте строку двумя пробелами или оставляйте пустую строку, чтобы сохранить перенос. Экспорт в .html — это ровно разметка панели предпросмотра, обёрнутая в минимальный документ, так что вы видите именно то, что экспортируется.
Всё, включая сам парсер, загружается вместе со страницей и работает локально. Откройте инструменты разработчика и понаблюдайте за вкладкой «Сеть» во время набора текста: ни один запрос не передаёт ваш текст, а редактор продолжает работать даже офлайн.