react-markdown@10.1.0 · LilScript port · @itslil/react-markdown

Markdown,
as React

Official react-markdown@10.1.0 rewritten in LilScript. The processor is published @itslil/unified + @itslil/remark-parse + @itslil/remark-rehype. Plugins install from the same scope: @itslil/remark-gfm, @itslil/remark-math, @itslil/rehype-katex.

npm install @itslil/react-markdown
Bytes over the wire, Brotli-11, against Terser of the official runtime graph smaller

Brotli-11 you ship, vs Terser
gzip-9 vs Terser
raw vs Terser
official tests

Default tab is the entire package. Other tabs are the published @itslil libraries this component installs.

Markdown MarkdownAsync MarkdownHooks remark-gfm remark-math rehype-katex @itslil

The stack

Whole package,
then each library.

The first tab is @itslil/react-markdown. The rest are size and spec receipts copied from each sibling GitHub Pages lab.

Measured in Node

Same work,
two runtimes.

Official rows are published react-markdown plus its runtime graph, then Terser and esbuild. LilScript is the compiled npm file plus the @itslil processor packages it imports.

Lane median vs official

The compiled runtime, in the browser

Live
lab.

Left is markdown. Right is @itslil/react-markdown with optional @itslil/remark-gfm, @itslil/remark-math, and @itslil/rehype-katex.

The receipts

Raw, gzip,
and Brotli.

Official react-markdown@10.1.0 bundled with its runtime graph, then Terser (mangle on/off) and esbuild minify. LilScript is not post-minified.

Brotli-11

The wire number. LilScript row is the npm file.

LaneBrotli-11vs Terser

gzip-9

Same files, gzip-9.

Lanegzip-9vs Terser

Raw

Uncompressed bytes.

LaneRawvs Terser

All three

Every lane, measured three ways.

LaneRawgzip-9Brotli-11Brotli vs Terser

Why this surface. The default tab is the component you install. Subpackage tabs are the same receipts each library already publishes on github.io.

README ↗

Install the stack

Plugins from
the same scope.

npm install @itslil/react-markdown @itslil/remark-gfm @itslil/remark-math @itslil/rehype-katex