Парсинг Markdown нативно с помощью Bun

Если вы когда-либо связывали воедино unified, remark-parse, remark-rehype и rehype-stringify только для того, чтобы преобразовать строку Markdown в HTML, вы знаете об этих накладных расходах. Bun 1.3.8 (выпущенный в январе 2026 года) поставляется со встроенным парсером Markdown, который заменяет всю эту цепочку одним вызовом API — без установок, без импортов, без настройки плагинов.

Вот что делает новый API Bun.markdown, как он работает и где он вписывается в ваш рабочий процесс.

Что такое парсер Markdown в Bun?

Bun.markdown — это нативный парсер Markdown, встроенный непосредственно в среду выполнения Bun. Он следует спецификации CommonMark и реализован как Zig-порт библиотеки md4c на языке C — парсера, используемого в критичных к производительности окружениях, таких как Qt.

Поскольку он работает как скомпилированный Zig-код, а не как JavaScript, он избегает накладных расходов JavaScript-пайплайнов парсинга, таких как unified и remark. Вместо объединения нескольких пакетов в цепочку, Bun предоставляет единый runtime API для обработки Markdown.

Примечание: API Bun.markdown в настоящее время помечен как нестабильный в официальной документации Bun. Интерфейс работает сегодня, но конкретные опции и сигнатуры методов могут измениться в будущих релизах Bun. Проверяйте примечания к релизам Bun перед обновлением в продакшене.

Преобразование Markdown в HTML в Bun: метод html()

Простейший случай использования — преобразование Markdown в HTML-строку — не требует настройки:

const html = Bun.markdown.html("# Hello **world**")
// "<h1>Hello <strong>world</strong></h1>\n"

Передайте опции вторым аргументом. Опция headings полезна для сайтов документации и генерации оглавления:

const html = Bun.markdown.html("## Getting Started", {
  headings: { ids: true }
})
// '<h2 id="getting-started">Getting Started</h2>\n'

Расширения GitHub Flavored Markdown (GFM) включены по умолчанию, включая таблицы, зачёркивание (~~text~~), списки задач (- [x] done) и разрешающие автоссылки. Также поддерживаются дополнительные опции, такие как wikiLinks, latexMath и автоматическое создание ссылок для заголовков.

Пользовательский рендеринг с помощью Bun.markdown.render()

Когда вам нужен вывод, отличный от стандартного HTML — стилизованная разметка, ANSI-вывод для терминала или обычный текст — render() принимает JavaScript-коллбэки для каждого типа элемента:

// Добавление CSS-классов к элементам
const html = Bun.markdown.render("# Title\n\nHello **world**", {
  heading: (children, { level }) => `<h${level} class="title">${children}</h${level}>`,
  paragraph: (children) => `<p class="body">${children}</p>`,
  strong: (children) => `<b>${children}</b>`,
})

// Удаление всего форматирования до обычного текста
const plain = Bun.markdown.render("# Title\n\n**bold** text", {
  heading: (children) => children + "\n",
  strong: (children) => children,
  paragraph: (children) => children + "\n",
})

// Возврат null для полного пропуска определённых элементов
const noImages = Bun.markdown.render("# Title\n\n![logo](img.png)", {
  image: () => null,
  heading: (children) => `<h1>${children}</h1>`,
})

Это делает render() полезным для CLI-инструментов, генерации электронных писем или любого пайплайна, где HTML не является целевым форматом.

Рендеринг Markdown в React с помощью react()

Bun.markdown.react() возвращает React-элементы, которые можно использовать непосредственно в дереве компонентов:

function Markdown({ text }: { text: string }) {
  return Bun.markdown.react(text)
}

// Сопоставление Markdown-элементов с пользовательскими компонентами
const element = Bun.markdown.react("# Hello", {
  h1: ({ children }) => <h1 className="page-title">{children}</h1>,
})

// Работает с серверным рендерингом
import { renderToString } from "react-dom/server"
const html = renderToString(Bun.markdown.react("# Hello **world**"))

Если вы используете React 18 или старше, вы можете передать опцию совместимости:

Bun.markdown.react(markdownText, undefined, { reactVersion: 18 })

Когда использовать Bun.markdown вместо Remark

Заключение

Если вы уже используете Bun 1.3.8 или новее, Bun.markdown доступен глобально — установка не требуется. Начните с Bun.markdown.html() для простых пайплайнов обработки контента и используйте render() или react(), когда вам нужен больший контроль над выводом.

Учитывая, что API всё ещё помечен как нестабильный, зафиксируйте версию Bun и протестируйте вывод рендеринга на соответствие ожидаемому HTML перед развёртыванием в продакшене.

Часто задаваемые вопросы

Gain Debugging Superpowers

Unleash the power of session replay to reproduce bugs, track slowdowns and uncover frustrations in your app. Get complete visibility into your frontend with OpenReplay — the most advanced open-source session replay tool for developers. Check our GitHub repo and join the thousands of developers in our community.