Skip to content

plugins to minify HTML

License

Notifications You must be signed in to change notification settings

playfulprogramming/rehype-minify

This branch is 35 commits behind rehypejs/rehype-minify:main.

Folders and files

NameName
Last commit message
Last commit date

Latest commit

1dc9280 · Apr 1, 2022
Sep 11, 2021
Apr 1, 2022
Apr 1, 2022
Mar 30, 2022
Sep 8, 2016
Aug 1, 2021
Sep 10, 2019
Jul 18, 2018
Jun 21, 2020
Nov 17, 2018
Nov 17, 2018
Feb 1, 2022
Mar 30, 2022
Feb 1, 2022
Aug 1, 2021

Repository files navigation

rehype-minify

Build Coverage Sponsors Backers Chat

rehype plugins to minify HTML.

Contents

What is this?

This GitHub repository is a monorepo that contains a couple utilities, ±30 plugins, and 1 preset to minify HTML:

In
<!doctype html>
<html lang="en-GB">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="content-language" content="en-US">
    <script src="index.js" type="text/javascript" language="javascript">
      alert(true);
    </script>
    <link rel="stylesheet" href="index.css" type="text/css">
    <title>Foo  &amp;  bar</title>
  </head>
  <body>
    <h1 class="foo foo">bar  bar</h1>
    <p id="alfred" id="alfred">  <strong>foo</strong> <em>bar</em> </p>
    <button type="BUTTON" onclick="javascript:return false">Alpha</button>
  </body>
</html>
Out
<!doctypehtml><html lang=en><meta charset=utf8><script src=index.js></script><link href=index.css rel=stylesheet><title>Foo &amp bar</title><h1 class=foo>bar bar</h1><p id=alfred><strong>foo</strong> <em>bar</em></p><button onclick=return!1 type=button>Alpha</button>

When should I use this?

This project is useful when you want to improve the size of HTML documents. It’s particularly useful when you’re already using rehype (and remark?) to process HTML.

Presets

Presets are combinations of plugins. One preset is maintained here:

Plugins

The following plugins maintained here are included in the above preset.

The following plugins are not included because they are potentially dangerous, can make sites slower in certain cases, or need extra configuration. Read their readmes carefully before using:

Also: pass allowDangerousCharacters to rehype-stringify if you trust your content.

Benchmark

Here’s a benchmark comparing the results from html-minifier and rehype-minify. To summarize: differences are negligible, in fact, minifying HTML doesn’t matter much. What does matter is using good compressions, such as gzip. Note: html-minifier crashes on stackoverflow.

name raw gzip
original rehype-minify html-minifier original rehype-minify html-minifier
amazon 446.35KB 7.74% 8.83% 114.03KB 6.38% 6.75%
bbc 293.18KB 3.65% 3.45% 36.3KB 1.72% 1.71%
bootstrap 35.18KB 21.66% 22.08% 8.4KB 4.85% 5.08%
compat table 7.6MB 16.67% 16.97% 241.77KB 3.69% 5.51%
ecmascript 6.58MB 9.55% 10.09% 790.72KB 5.26% 5.43%
eloquent 80.09KB 6.43% 6.45% 19.13KB 1.24% 1.26%
github 184.92KB 16.86% 16.18% 34.39KB 7.00% 7.20%
google 13.01KB 7.60% 7.56% 5.75KB 4.56% 4.26%
guardian 929.59KB 3.76% 4.20% 128.07KB 2.78% 2.93%
html 11.17MB 3.28% 3.31% 1.66MB 5.41% 5.49%
linkedin 84.47KB 38.03% 37.97% 10.54KB 13.70% 13.43%
microsoft 197.87KB 8.82% 21.02% 40.16KB 4.44% 6.85%
nbc 1.48MB 5.65% 5.79% 214.5KB 1.88% 1.77%
npm 23.12KB 8.31% 7.89% 7.13KB 4.36% 3.99%
nytimes 1.17MB 8.90% 8.59% 123.83KB 4.42% 4.12%
rocketchat 186.83KB 12.15% 💥 28.81KB 7.10% 💥
slack 119.24KB 4.81% 3.94% 35.76KB 1.95% 1.55%
stackoverflow 117.91KB 31.43% 33.03% 22.1KB 9.95% 10.84%
twitter 42.86KB 9.40% 9.11% 13.33KB 3.70% 3.45%
vice 182.35KB 5.29% 4.91% 40.65KB 4.89% 4.70%
wikipedia 658.95KB 6.06% 6.81% 126.5KB 1.89% 2.12%
total 31.52MB 29.07MB 29.02MB 3.65MB 3.48MB 3.48MB

Huge differences in results are suspicious and may point to bugs.

💥 — Crash.

Security

Use of rehype-preset-minify is safe by default, if the tree is already safe. As rehype works on HTML, and improper use of HTML can open you up to a cross-site scripting (XSS) attack, use of rehype can also be unsafe. Use rehype-sanitize to make the tree safe.

To further optimize the result disregarding security, use the extra plugins listed above and pass allowDangerousCharacters to rehype-stringify.

Related

Contribute

See contributing.md in rehypejs/.github for ways to get started. See support.md for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

License

MIT © Titus Wormer

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 100.0%