mdBook icon indicating copy to clipboard operation
mdBook copied to clipboard

Add minification for CSS and JS files

Open GuillaumeGomez opened this issue 7 months ago • 6 comments

Here are the file size differences:

file before after diff
chrome.css 16535 12014 -37.4%
general.css 6531 4122 -36.9%
print.css 661 505 -23.6%
variables.css 8836 6735 -23.8%
book.js 28707 17964 -37.4%

GuillaumeGomez avatar Jun 12 '25 16:06 GuillaumeGomez

I added comparisons as well in the first comment.

GuillaumeGomez avatar Jun 12 '25 19:06 GuillaumeGomez

Thanks! I had a few questions:

  • This isn't like a typical minifier that renames and does other compression, correct?
  • Would there be any benefit to having source maps, or some plan to getting those in the future?
  • Should this include searcher.js? Or mode-rust.js?
  • I've been wondering about combining files. Is that an option for the future? For example, there are a bunch of CSS files, would it be possible to combine them somehow? I've often wondered, as it seems like it would be pretty inefficient to have a bunch of network requests for several small files.
  • The debugging experience seems to be hindered a little by this. I'm wondering if it would be possible to turn this off while using mdbook serve?

ehuss avatar Jun 21 '25 20:06 ehuss

This isn't like a typical minifier that renames and does other compression, correct?

Indeed, it's just to remove unneeded characters (so mostly whitespace) and comments (while keeping the license). Anything more advanced would require a full JS parser, which I plan to add "some day".

Would there be any benefit to having source maps, or some plan to getting those in the future?

Never used source map so I can't answer this. If you used source maps, do you think it would be worthwhile to have them?

Should this include searcher.js? Or mode-rust.js?

searcher.js yes, but mode-rust.js seems to be already minified?

I've been wondering about combining files. Is that an option for the future? For example, there are a bunch of CSS files, would it be possible to combine them somehow? I've often wondered, as it seems like it would be pretty inefficient to have a bunch of network requests for several small files.

I suppose we could. First we need to check if some files are always on the same pages. In this case, we can merge their source code directly. However if some files are not always on the same pages, then either we generate different CSS files which include some CSS files. If there is a possibility here, it would reduce the number of files, so I think it'd be a very good thing to do.

The debugging experience seems to be hindered a little by this. I'm wondering if it would be possible to turn this off while using mdbook serve?

There isn't currently but we can definitely add an option to not run minimization (although, since we have the "pretty format" feature in all web browsers, it's mostly ok imo). Gonna add it in this PR then.

GuillaumeGomez avatar Jun 23 '25 14:06 GuillaumeGomez

I added searcher.js and toc.js to the list of the minified files. I also added the --disable-minification option.

GuillaumeGomez avatar Jun 25 '25 17:06 GuillaumeGomez

I removed the possibility to disable minification for now.

GuillaumeGomez avatar Jul 16 '25 14:07 GuillaumeGomez

:umbrella: The latest upstream changes (possibly 21f2435182e4a80c0bd0e3184ce36f7a57529d08) made this pull request unmergeable. Please resolve the merge conflicts.

rustbot avatar Aug 18 '25 18:08 rustbot