Benchmark: Markdown Performance Comparison 2024-10-23

HTML Preparation code:

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<script type="module">import SimpleMarkdown from 'https://esm.sh/@khanacademy/simple-markdown';window.SimpleMarkdown = SimpleMarkdown</script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
<script type="module">import {remark} from 'https://esm.sh/remark?bundle';window.remark = remark</script>
<script type="text/javascript" src="https://unpkg.com/commonmark/dist/commonmark.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/showdown/dist/showdown.min.js"></script>
<script type="text/javascript" src="https://unpkg.com/remarkable/dist/remarkable.min.js"></script>
<script type="module">import {micromark} from 'https://esm.sh/micromark?bundle';window.micromark = micromark</script>
<script type="text/javascript" src="https://unpkg.com/snarkdown/dist/snarkdown.umd.js"></script>

Script Preparation code:

var conv = {
  marked: marked.use({ gfm: true }).parse,
  simpleMarkdown: (md) => SimpleMarkdown.defaultOutput(SimpleMarkdown.defaultBlockParse(md)),
  mdit: markdownit({ html: true }),
  remark: (md) => window.remark().process(md),
  cm: new commonmark.HtmlRenderer(),
  showdown: new showdown.Converter(),
  remarkable: new remarkable.Remarkable('full'),
  micromark: window.micromark,
  snarkdown: snarkdown
};

var pars = {
  cm: new commonmark.Parser()
};

var md = [
"---",
"__Advertisement :)__",
"",
"- __[pica](https://nodeca.github.io/pica/demo/)__ - high quality and fast image",
"  resize in browser.",
"- __[babelfish](https://github.com/nodeca/babelfish/)__ - developer friendly",
"  i18n with plurals support and easy syntax.",
"",
"You will like those projects!",
"",
"---",
"",
"# h1 Heading 8-)",
"## h2 Heading",
"### h3 Heading",
"#### h4 Heading",
"##### h5 Heading",
"###### h6 Heading",
"",
"",
"## Horizontal Rules",
"",
"___",
"",
"---",
"",
"***",
"",
"",
"## Typographic replacements",
"",
"Enable typographer option to see result.",
"",
"(c) (C) (r) (R) (tm) (TM) (p) (P) +-",
"",
"test.. test... test..... test?..... test!....",
"",
"!!!!!! ???? ,,  -- ---",
"",
"\"Smartypants, double quotes\" and 'single quotes'",
"",
"",
"## Emphasis",
"",
"**This is bold text**",
"",
"__This is bold text__",
"",
"*This is italic text*",
"",
"_This is italic text_",
"",
"~~Strikethrough~~",
"",
"",
"## Blockquotes",
"",
"",
"> Blockquotes can also be nested...",
">> ...by using additional greater-than signs right next to each other...",
"> > > ...or with spaces between arrows.",
"",
"",
"## Lists",
"",
"Unordered",
"",
"+ Create a list by starting a line with `+`, `-`, or `*`",
"+ Sub-lists are made by indenting 2 spaces:",
"  - Marker character change forces new list start:",
"    * Ac tristique libero volutpat at",
"    + Facilisis in pretium nisl aliquet",
"    - Nulla volutpat aliquam velit",
"+ Very easy!",
"",
"Ordered",
"",
"1. Lorem ipsum dolor sit amet",
"2. Consectetur adipiscing elit",
"3. Integer molestie lorem at massa",
"",
"",
"1. You can use sequential numbers...",
"1. ...or keep all the numbers as `1.`",
"",
"Start numbering with offset:",
"",
"57. foo",
"1. bar",
"",
"",
"## Code",
"",
"Inline `code`",
"",
"Indented code",
"",
"    // Some comments",
"    line 1 of code",
"    line 2 of code",
"    line 3 of code",
"",
"",
"Block code \"fences\"",
"",
"```",
"Sample text here...",
"```",
"",
"Syntax highlighting",
"",
"``` js",
"var foo = function (bar) {",
"  return bar++;",
"};",
"",
"console.log(foo(5));",
"```",
"",
"## Tables",
"",
"| Option | Description |",
"| ------ | ----------- |",
"| data   | path to data files to supply the data that will be passed into templates. |",
"| engine | engine to be used for processing templates. Handlebars is the default. |",
"| ext    | extension to be used for dest files. |",
"",
"Right aligned columns",
"",
"| Option | Description |",
"| ------:| -----------:|",
"| data   | path to data files to supply the data that will be passed into templates. |",
"| engine | engine to be used for processing templates. Handlebars is the default. |",
"| ext    | extension to be used for dest files. |",
"",
"",
"## Links",
"",
"[link text](http://dev.nodeca.com)",
"",
"[link with title](http://nodeca.github.io/pica/demo/ \"title text!\")",
"",
"Autoconverted link https://github.com/nodeca/pica (enable linkify to see)",
"",
"",
"## Images",
"",
"![Minion](https://octodex.github.com/images/minion.png)",
"![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg \"The Stormtroopocat\")",
"",
"Like links, Images also have a footnote style syntax",
"",
"![Alt text][id]",
"",
"With a reference later in the document defining the URL location:",
"",
"[id]: https://octodex.github.com/images/dojocat.jpg  \"The Dojocat\"",
"",
"",
"## Plugins",
"",
"The killer feature of `markdown-it` is very effective support of",
"[syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin).",
"",
"",
"### [Emojies](https://github.com/markdown-it/markdown-it-emoji)",
"",
"> Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum:",
">",
"> Shortcuts (emoticons): :-) :-( 8-) ;)",
"",
"see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji.",
"",
"",
"### [Subscipt](https://github.com/markdown-it/markdown-it-sub) / [Superscirpt](https://github.com/markdown-it/markdown-it-sup)",
"",
"- 19^th^",
"- H~2~O",
"",
"",
"### [\<ins>](https://github.com/markdown-it/markdown-it-ins)",
"",
"++Inserted text++",
"",
"",
"### [\<mark>](https://github.com/markdown-it/markdown-it-mark)",
"",
"==Marked text==",
"",
"",
"### [Footnotes](https://github.com/markdown-it/markdown-it-footnote)",
"",
"Footnote 1 link[^first].",
"",
"Footnote 2 link[^second].",
"",
"Inline footnote^[Text of inline footnote] definition.",
"",
"Duplicated footnote reference[^second].",
"",
"[^first]: Footnote **can have markup**",
"",
"    and multiple paragraphs.",
"",
"[^second]: Footnote text.",
"",
"",
"### [Definition lists](https://github.com/markdown-it/markdown-it-deflist)",
"",
"Term 1",
"",
":   Definition 1",
"with lazy continuation.",
"",
"Term 2 with *inline markup*",
"",
":   Definition 2",
"",
"        { some code, part of Definition 2 }",
"",
"    Third paragraph of definition 2.",
"",
"_Compact style:_",
"",
"Term 1",
"  ~ Definition 1",
"",
"Term 2",
"  ~ Definition 2a",
"  ~ Definition 2b",
"",
"",
"### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr)",
"",
"This is HTML abbreviation example.",
"",
"It converts \"HTML\", but keep intact partial entries like \"xxxHTMLyyy\" and so on.",
"",
"*[HTML]: Hyper Text Markup Language",
"---",
"__Advertisement :)__",
"",
"- __[pica](https://nodeca.github.io/pica/demo/)__ - high quality and fast image",
"  resize in browser.",
"- __[babelfish](https://github.com/nodeca/babelfish/)__ - developer friendly",
"  i18n with plurals support and easy syntax.",
"",
"You will like those projects!",
"",
"---",
"",
"# h1 Heading 8-)",
"## h2 Heading",
"### h3 Heading",
"#### h4 Heading",
"##### h5 Heading",
"###### h6 Heading",
"",
"",
"## Horizontal Rules",
"",
"___",
"",
"---",
"",
"***",
"",
"",
"## Typographic replacements",
"",
"Enable typographer option to see result.",
"",
"(c) (C) (r) (R) (tm) (TM) (p) (P) +-",
"",
"test.. test... test..... test?..... test!....",
"",
"!!!!!! ???? ,,  -- ---",
"",
"\"Smartypants, double quotes\" and 'single quotes'",
"",
"",
"## Emphasis",
"",
"**This is bold text**",
"",
"__This is bold text__",
"",
"*This is italic text*",
"",
"_This is italic text_",
"",
"~~Strikethrough~~",
"",
"",
"## Blockquotes",
"",
"",
"> Blockquotes can also be nested...",
">> ...by using additional greater-than signs right next to each other...",
"> > > ...or with spaces between arrows.",
"",
"",
"## Lists",
"",
"Unordered",
"",
"+ Create a list by starting a line with `+`, `-`, or `*`",
"+ Sub-lists are made by indenting 2 spaces:",
"  - Marker character change forces new list start:",
"    * Ac tristique libero volutpat at",
"    + Facilisis in pretium nisl aliquet",
"    - Nulla volutpat aliquam velit",
"+ Very easy!",
"",
"Ordered",
"",
"1. Lorem ipsum dolor sit amet",
"2. Consectetur adipiscing elit",
"3. Integer molestie lorem at massa",
"",
"",
"1. You can use sequential numbers...",
"1. ...or keep all the numbers as `1.`",
"",
"Start numbering with offset:",
"",
"57. foo",
"1. bar",
"",
"",
"## Code",
"",
"Inline `code`",
"",
"Indented code",
"",
"    // Some comments",
"    line 1 of code",
"    line 2 of code",
"    line 3 of code",
"",
"",
"Block code \"fences\"",
"",
"```",
"Sample text here...",
"```",
"",
"Syntax highlighting",
"",
"``` js",
"var foo = function (bar) {",
"  return bar++;",
"};",
"",
"console.log(foo(5));",
"```",
"",
"## Tables",
"",
"| Option | Description |",
"| ------ | ----------- |",
"| data   | path to data files to supply the data that will be passed into templates. |",
"| engine | engine to be used for processing templates. Handlebars is the default. |",
"| ext    | extension to be used for dest files. |",
"",
"Right aligned columns",
"",
"| Option | Description |",
"| ------:| -----------:|",
"| data   | path to data files to supply the data that will be passed into templates. |",
"| engine | engine to be used for processing templates. Handlebars is the default. |",
"| ext    | extension to be used for dest files. |",
"",
"",
"## Links",
"",
"[link text](http://dev.nodeca.com)",
"",
"[link with title](http://nodeca.github.io/pica/demo/ \"title text!\")",
"",
"Autoconverted link https://github.com/nodeca/pica (enable linkify to see)",
"",
"",
"## Images",
"",
"![Minion](https://octodex.github.com/images/minion.png)",
"![Stormtroopocat](https://octodex.github.com/images/stormtroopocat.jpg \"The Stormtroopocat\")",
"",
"Like links, Images also have a footnote style syntax",
"",
"![Alt text][id]",
"",
"With a reference later in the document defining the URL location:",
"",
"[id]: https://octodex.github.com/images/dojocat.jpg  \"The Dojocat\"",
"",
"",
"## Plugins",
"",
"The killer feature of `markdown-it` is very effective support of",
"[syntax plugins](https://www.npmjs.org/browse/keyword/markdown-it-plugin).",
"",
"",
"### [Emojies](https://github.com/markdown-it/markdown-it-emoji)",
"",
"> Classic markup: :wink: :crush: :cry: :tear: :laughing: :yum:",
">",
"> Shortcuts (emoticons): :-) :-( 8-) ;)",
"",
"see [how to change output](https://github.com/markdown-it/markdown-it-emoji#change-output) with twemoji.",
"",
"",
"### [Subscipt](https://github.com/markdown-it/markdown-it-sub) / [Superscirpt](https://github.com/markdown-it/markdown-it-sup)",
"",
"- 19^th^",
"- H~2~O",
"",
"",
"### [\<ins>](https://github.com/markdown-it/markdown-it-ins)",
"",
"++Inserted text++",
"",
"",
"### [\<mark>](https://github.com/markdown-it/markdown-it-mark)",
"",
"==Marked text==",
"",
"",
"### [Footnotes](https://github.com/markdown-it/markdown-it-footnote)",
"",
"Footnote 1 link[^first].",
"",
"Footnote 2 link[^second].",
"",
"Inline footnote^[Text of inline footnote] definition.",
"",
"Duplicated footnote reference[^second].",
"",
"[^first]: Footnote **can have markup**",
"",
"    and multiple paragraphs.",
"",
"[^second]: Footnote text.",
"",
"",
"### [Definition lists](https://github.com/markdown-it/markdown-it-deflist)",
"",
"Term 1",
"",
":   Definition 1",
"with lazy continuation.",
"",
"Term 2 with *inline markup*",
"",
":   Definition 2",
"",
"        { some code, part of Definition 2 }",
"",
"    Third paragraph of definition 2.",
"",
"_Compact style:_",
"",
"Term 1",
"  ~ Definition 1",
"",
"Term 2",
"  ~ Definition 2a",
"  ~ Definition 2b",
"",
"",
"### [Abbreviations](https://github.com/markdown-it/markdown-it-abbr)",
"",
"This is HTML abbreviation example.",
"",
"It converts \"HTML\", but keep intact partial entries like \"xxxHTMLyyy\" and so on.",
"",
"*[HTML]: Hyper Text Markup Language"].join("\n");

Tests:

Showdown
conv.showdown.makeHtml(md);
Marked
conv.marked(md);
CommonMark
conv.cm.render(pars.cm.parse(md));
markdown-it
conv.mdit.render(md);
remarkable
conv.remarkable.render(md);
micromark
conv.micromark(md);
Snarkdown
conv.snarkdown(md);
remark
conv.remark(md)
simple-markdown
conv.simpleMarkdown(md)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Showdown
Marked
CommonMark
markdown-it
remarkable
micromark
Snarkdown
remark
simple-markdown

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 19 days ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/131.0.0.0 Safari/537.36

Browser/OS: Chrome 131 on Windows

View result in a separate tab

Test name	Executions per second
Showdown	471.9 Ops/sec
Marked	1750.2 Ops/sec
CommonMark	3645.4 Ops/sec
markdown-it	2753.0 Ops/sec
remarkable	3720.6 Ops/sec
micromark	213.4 Ops/sec
Snarkdown	3698.2 Ops/sec
remark	186.9 Ops/sec
simple-markdown	952.7 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):

LLMs can make mistakes. Check important info.

The benchmark defined in the JSON represents a performance comparison of several leading JavaScript libraries that convert Markdown text to HTML. The libraries being compared are `Showdown`, `Marked`, `CommonMark`, `markdown-it`, `remarkable`, `micromark`, `snarkdown`, `remark`, and `simple-markdown`. Each of these libraries is designed for parsing Markdown, but they may differ in terms of feature support, performance, and use cases.

### Overview of Libraries and Their Purposes:

1. **Showdown**:
   - **Purpose**: Converts Markdown text to HTML.
   - **Pros**: User-friendly, easy to integrate, and generally well-documented. 
   - **Cons**: Might not be as fast or flexible for complex scenarios compared to some other libraries.
  
2. **Marked**:
   - **Purpose**: An extremely fast Markdown parser and compiler.
   - **Pros**: Known for its speed and flexibility, with many features to customize the output.
   - **Cons**: May not have some advanced features found in other libraries like plugins.
  
3. **CommonMark**:
   - **Purpose**: Provides a strict specification of Markdown, ensuring consistent parsing.
   - **Pros**: Excellent for users who want to adhere to the CommonMark spec, leading to predictable behavior.
   - **Cons**: The strictness might not accommodate all Markdown styles, limiting creativity.

4. **markdown-it**:
   - **Purpose**: A fast Markdown parser supporting extensions and customizable options.
   - **Pros**: Very modular and extensible; supports a variety of plugins.
   - **Cons**: Performance can vary based on the number of enabled plugins.

5. **remarkable**:
   - **Purpose**: A highly customizable Markdown parser.
   - **Pros**: Offers a balance between speed and features, highly configurable.
   - **Cons**: Some users may find the customization options overwhelming.

6. **micromark**:
   - **Purpose**: A very fast and minimal Markdown parser that is compliant with the CommonMark specification.
   - **Pros**: Fast and efficient, particularly for performance-critical applications.
   - **Cons**: May lack some advanced features that users might find in the more extensive libraries.

7. **snarkdown**:
   - **Purpose**: A lightweight Markdown converter.
   - **Pros**: Simple and straightforward; optimal for basic use cases without extra weight.
   - **Cons**: Not feature-rich and may not handle more complex Markdown syntax effectively.

8. **remark**:
   - **Purpose**: A Markdown processor built on the unified framework.
   - **Pros**: Offers extensive plugin support and is ideal for advanced documentation and parsing tasks.
   - **Cons**: Configuration may be complex, and it may not be required for simpler tasks.

9. **simple-markdown**:
   - **Purpose**: A simple Markdown parser that provides flexibility with an output format.
   - **Pros**: Great for projects that require basic Markdown support without added complexity.
   - **Cons**: Performance may not be as strong compared to more optimized libraries.

### Benchmark Execution

The benchmark has been designed to measure the conversion performance of each library by executing a test Markdown string (the `md` variable defined in the preparation code) and timing how many executions can be completed per second (ExecutionsPerSecond).

The results reveal that `Snarkdown` is the most performant among the tested libraries, followed by `remarkable`, while `remark` and `micromark` are significantly slower. This data can inform developers making decisions based on performance needs vs. feature requirements.

### Alternative Approaches

In addition to the libraries tested here, other approaches can be considered:

1. **Custom Implementations**: Depending on the project's needs, writing a custom Markdown parser might be feasible if existing libraries do not meet specific requirements or if performance is crucial.

2. **Server-Side Rendering**: For projects where server resources are available, Markdown can be parsed server-side prior to being sent to the client, potentially offloading some performance concerns.

3. **Hybrid Approaches**: Combining multiple libraries to leverage strengths can sometimes yield better results, especially in complex applications.

In conclusion, the benchmark serves as a valuable resource for developers seeking to understand the performance characteristics of popular Markdown libraries in JavaScript. Depending on specific needs such as speed, feature set, and ease of use, developers can choose the library that best aligns with their project goals.

Related benchmarks:

Markdown Performance Comparison 2024-10-23 (version: 1)

A performance comparison of leading JavaScript Markdown implementations.

Comparing performance of: Showdown vs Marked vs CommonMark vs markdown-it vs remarkable vs micromark vs Snarkdown vs remark vs simple-markdown

Created: 2 months ago by: Registered User

Jump to the latest result

Showdown

Marked

CommonMark

markdown-it

remarkable

micromark

Snarkdown

remark

simple-markdown

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):