Слогер Создать блог
Разработка

Как конвертировать Markdown в HTML в браузере без загрузки файлов на сервер

Разбираем браузерный конвертер, который умеет Mermaid, KaTeX и сборку HTML с картинками в один файл — и честно говорим об ограничениях.

Если вы хоть раз отправляли Markdown-файл человеку, который живёт не в текстовом редакторе, вы поймёте. README для клиента, заметки со встречи, короткий документ с парой схем. Всё это обычно нужно отдать как HTML, а не как .md. И каждый раз упираешься в одно и то же.

Первое: что-то сложнее простого GFM — Mermaid-диаграмма, формула KaTeX — ломает конвертер. Вместо блок-схемы вы получаете код-фенс, вместо формулы — сырые доллары и backslash. Второе: те документы, которые нужно конвертировать, обычно меньше всего хочется загружать на чужой сервер. Внутренние заметки, черновики, клиентские материалы. А большинство онлайн-конвертеров именно так и работают.

Вышел из положения инструмент под названием mdhtml. Это конвертер, который работает целиком в браузере. Никакой установки, регистрации и загрузки файлов: конвертация происходит на стороне клиента.

Что умеет

  • Оба направления. Markdown → HTML и HTML → Markdown на одной странице. Обратная сторона принимает .html-файл, вставленный код, содержимое, скопированное прямо с веб-страницы, или URL.
  • GFM: таблицы, списки задач, зачёркнутый текст.
  • Подсветка синтаксиса в блоках кода.
  • Mermaid и KaTeX действительно рендерятся. Движки подгружаются лениво, только если документ их использует. Обычный Markdown не тянет лишнего.
  • Пакетная конвертация: бросили несколько файлов — скачали результаты по отдельности или одним ZIP.
  • Печать и PDF с принт-френдли стилями прямо из превью.
  • Интерфейс доступен на английском и корейском.

Главная фишка — один файл вместо папки с картинками

Самое неприятное при передаче сконвертированного Markdown — это папка images. Отправляете HTML, забываете папку — и получаете страницу, полную битых иконок.

Здесь это решено так: перетащите на страницу одновременно .md-файлы и файлы картинок. Конвертер сопоставляет картинки с Markdown по именам файлов, кодирует их в base64 и встраивает прямо в HTML.

На выходе — один самодостаточный .html. Его можно отправить по почте, положить в чат или убрать в архив. Картинки откроются даже без интернета. Никаких папок с ассетами, ничего не нужно тянуть с сервера.

Тут есть trade-off, о котором стоит знать: base64 увеличивает размер. Документ со скриншотами даст заметно более тяжёлый HTML, чем исходные файлы. Но для большинства коротких документов это того стоит.

Честные ограничения

  • Инструмент работает на стороне клиента с одним исключением — опциональный «импорт по URL». Браузер не может сам запросить страницу с другого домена, поэтому этот путь идёт через небольшой прокси на сервере автора. Это единственная точка, где что-то касается сервера. Если URL-импортом не пользоваться, никуда ничего не отправляется.
  • Это конвертер, а не редактор и не генератор сайтов. Он не строит навигацию, не делает тему и не собирает сайт вокруг документов. Просто превращает один формат в другой.

Как этим пользоваться

Простейший сценарий. Подготовьте .md с таблицами, кодом и Mermaid-блоком. Перетащите файлы в окно; если в документе есть картинки — добавьте их туда же. Посмотрите в превью, рендерятся ли диаграммы и формулы. Скачайте HTML или сразу PDF.

Если нужно сконвертировать HTML обратно в Markdown — вставьте код или скопируйте содержимое страницы. Для одного документа, который не хочется никуда загружать, этого достаточно.

Когда браузерный конвертер лучше онлайн-сервиса

СценарийЛокальный конвертерОнлайн-сервис
Конфиденциальный документФайлы не покидают устройствоВсё уходит на сервер
Mermaid и KaTeXРендерит, движки подгружаются только если нужныЗависит от сервиса, часто ломается
Картинки в HTMLВстраивает base64, отдаёт один файлОбычно отдаёт папку с картинками
Импорт по URLЧерез прокси-исключениеПрямой запрос
Сборка сайтаНе умеет, это не его задачаЧасто тоже не умеет или требует регистрации

Вывод

Браузерный конвертер не переизобретает Markdown. Он закрывает две конкретные потребности: не отправлять документы на чужой сервер и получать один HTML-файл, который не развалится от Mermaid, KaTeX или встроенных картинок. Если вы регулярно отдаёте .md людям «не из мира текстовых редакторов» — попробуйте. По крайней мере теперь есть вариант, который не требует ничего устанавливать и подписываться.

По материалам: dev. Текст переработан редакцией Слогера.

← На главную

Рекламное место — Конец поста
Реклама · Слогер

Комментарии (0)

Войдите, чтобы комментировать.

Пока нет комментариев. Будьте первым.