search

jorendorff / es-spec-html

An HTML version of the ECMAScript draft specification autogenerated from the source
http://ecma-international.org/ecma-262/5.1/
51 stars 17 forks source link

Minify HTML #84

Open kangax opened 9 years ago

kangax commented 9 years ago

I ran the entire page through my html-minifier — ES6 spec seems like a perfect candidate for it.

Here's the result:

Size before Size after Savings
3765813 (3677.55 KB) 3132089 (3058.68 KB) 16.83% (618.87 KB)
434781 (424.59 KB) 382709 (373.74 KB) 11.98% (50.85 KB)

Second colum is (more representative) gzipped comparison. So it's pure savings of 50KB (already accounting for gzip which is how the page is transferred) and it only takes ~3 sec to minify it as a one-time task.

There should be no differences in rendering.

What do you think? Worth it?

jorendorff commented 9 years ago

If this is a 2-line change to the go script, sure, I'll take a PR for it.

Rationale: OK, this is just barely worth it. Even in pessimistic circumstances, the 12% savings might mean the difference between waiting 1 minute for the whole document and waiting 1 minute 7 seconds; or it might mean the difference between having a 35% chance of successfully downloading the whole document vs. a 40% chance.

Changing the Python script to spit out minified HTML could likely be done by deleting code, rather than adding it, but an external tool is better. The output from es-spec.py is pretty-printed on purpose. That way I can use git diff es6-draft.html to see if the output seems sane, and sometimes get a feel for what's changed.

Honestly, there are other ideas I'd rather see pursued to improve the download speed: change the script to generate multipage output, or a hypothetical fancy new JS-powered page that downloads the text incrementally. Maybe Markdown output, which would be more compact than HTML. But I'll take what I can get!

mathiasbynens commented 9 years ago

Re: multipage output, ref. https://github.com/jorendorff/es-spec-html/issues/5.

mathiasbynens commented 9 years ago

@jorendorff To install the HTML minifier dependency using npm:

npm install html-minifier -g

Then, every time you build a new version of es6-draft.html, run this command:

html-minifier --collapse-whitespace --remove-attribute-quotes --remove-redundant-attributes --prevent-attributes-escaping --use-short-doctype --remove-optional-tags es6-draft.html > es6-draft-minified.html

I can submit a PR that adds this info to the README, but it might be better to create a build.sh or Makefile that includes this command and recommend using that in the README.