melonmanchan/express-minify-html

Apply minification to inline JS, CSS

mcandre opened this issue · 1 comments

mcandre commented

I set minifyJS to true, but my inline JavaScript snippets are not being minified.

Could express-minify-html minify inline JS, and inline CSS as well? That could also reduce our bandwidth costs!

stevenventimiglia commented

@mcandre - My current workaround for this would be to minify your CSS and JS, with the tags touching the code. For example:

<style>
    #king{color: gold;}
    #queen{color: silver;}
</style>
<script>
    alert("This ain't gonna work.");
</script>

...should be placed into the <head> or <body> as...

<style>#king{color: gold;}#queen{color: silver;}</style>
<script>alert("This ain't gonna work.");</script>

In this case, you'd take the code you'll be adding, placing it into a .css or .js file; then, minifying the file (without saving the changes, if you intend to use it as an unaltered backup.)

Simple <script>...</script> tags, with minimal code, don't seem to have any issues (with either version of the the alert() that I used as an example.) However, the <style> tags are separated by the code between them (unminified), and that could be causing the issue.

My guess would be that meta tags (except for the <title>...</title>) use properties and values as opposed to content placed within them. The <style> tags seem to have been overlooked as items within the <head> or <body> that may need to be minified, as well.

I may just make it part of my Gulp pipeline, storing the files in a different location than what's already being processed, so I can copy/paste the minified code into my view(s) without the extra step of processing it by hand.

  • 👎2