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

Как конвертировать 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)

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

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

Карьера

Почему резюме не работает: как доказать навыки живыми проектами

Разбор подхода proof-of-work: зачем показывать работающий продукт и видео-демо вместо строчки «разрабатывал сервис», как это обходит автоматические фильтры и что подготовить, чтобы запрос на интервью не ушёл в пустоту.

Слогер 26.09.2026 ▲ 0
Fluxs lenta
Реклама · fluxs.ru
Стартапы

Конструктор бизнес-модели: схема из рабочих модулей, которую можно перенести на Fluxs

Это не просто схема. Каждый блок в нашем конструкторе бизнес-модели настоящий работающий модуль Fluxs: воронка, лиды, письма, мессенджер, 1С, поставка. Поэтому нарисованное можно перенести на платформу: по выбранным блокам подключаем и настраиваем те же модули, вы делаете это сами или с нами. Подходит и новому делу, где нужно понять, что вообще понадобится, и действующему бизнесу: увидите, каких сценариев не хватает, достроите их и переложите работу на Fluxs по частям, без остановки.

Слогер 25.09.2026 ▲ 0
Карьера

Как выбраться из выгорания разработчику: 6 книг с рабочими инструментами

Выгорание — это не просто усталость, а пропавший интерес, спад продуктивности и вера в то, что ты разучился писать код. Разбираем шесть книг, которые дают конкретные приёмы, а не мотивацию.

Слогер 25.09.2026 ▲ 0
Fluxs lenta
Реклама · fluxs.ru
AI

Что такое RAG и как он работает: разбор восьми шагов для тех, кто не пишет код

RAG звучит как что-то из докладов для разработчиков, но объясняется за пять минут. Разбираем весь путь от вопроса к ответу — с архивом, секретарём и петлями, которые обычно не рисуют на схемах.

Слогер 25.09.2026 ▲ 0
Разработка

Как ловить гонки данных в тестовом задании: разбор задачи про последний товар на складе

Один зелёный тест ничего не доказывает, если весь код крутится в одном процессе. Разбираю, как устроить проверку на двух воркерах и что именно писать в рубрику оценки.

Слогер 25.09.2026 ▲ 0
Разработка

Как выйти из ступора при выборе архитектуры: 5 книг и рабочий алгоритм

Выбор между монолитом, сервисами и очередью превращается в бесконечное гугление. Разбираем, почему мозг залипает на архитектурных решениях и какие книги дают рамку вместо готового ответа.

Слогер 24.09.2026 ▲ 0
Fluxs lenta
Реклама · fluxs.ru
AI

Как выглядит бизнесмен, который перестал держать всё в голове

Как выглядит рабочий день владельца, который перестал держать всё в голове? Утром он открывает мессенджер и видит, кто написал за ночь. Отвечал не менеджер, а AI-чат на сайте по базе знаний. Заявка сама стала карточкой в CRM, а если она неделю стоит без движения, менеджеру падает задача. Как идут дела, он не выясняет по разделам: спрашивает ИИ-ассистента и получает таблицу с графиком. Может продиктовать голосом. Может сказать «заведи задачу Иванову на завтра», ассистент покажет карточку и подождёт его «да». Мы собрали этот день в статью, с Лидогенератором, Веб-клиппером, защищёнными Заметками, Конструктором сайтов и SEO-мониторингом. Портрет собирательный, но каждый модуль в нём настоящий.

Слогер 23.09.2026 ▲ 0