Analyzes and processes HTML for ideal hosting in production. All referenced CSS and JS is minified and concatenated according to HTML comments you put in your HTML file(s).
Input requires that all things to be analyzed is in one sub-directory.
grymtis a solution to not being able to use Grunt as desired. Grunt is a great framework but it's hard to get it to work exactly as you like. Individual Grunt "recipes" work, but not all together.
Alternatively, in this project root there is a full app called
python grymt.py exampleapp
Now inspect what was created in
How to use it
First install it,
pip install grymt
ls app/ index.html partials static
That'll create a directory called
dist which is a copy of
app but with
HTML, CSS and JS optimized.
There are a growing list of options under,
Copyright: Peter Bengtsson
- You can use hashes. For example,
<!-- build:js $hash.min.js --> <script src="foo.js"></script> <script src="bar.js"></script> <!-- endbuild -->
then you get a file called
95afdee.min.js where the hash is a
checksum on the files' combined content.
- You can inline your CSS or your JS instead of making it an external file. For example,
<head> <!-- build:css stuff.css --> <link href="foo.css"> <link href="bar.css"> <!-- endbuild --> </head>
<head> <style> ...content of foo.css minified... ...content of bar.css minified... </style>
which is, depending on circumstances, a good web performance optimization trick because you reduce the number of dependencies on external resources and makes it easier for the browser to start rendering stuff to the screen sooner.
someframework-min.cssdoesn't get minimized again.
You can put
$git_revision_short) anywhere in your HTML that gets converted to the current git HEAD sha.
All images referenced in CSS gets unique and nice names that makes it possible to set far-future cache headers on them.
You can set HTML to be removed. This example demonstrates it well:
<script>var DEBUG = false</script> <!-- build:remove --> <script>DEBUG = true</script> <!-- endbuild -->
That makes it so that
false when in production.
You can use include files that thus only get inserted in the built code. For example:
<head> <!-- build:include /google-analytics.html --> </head>
If you put something like
$git_revision_short in your
html, grymt will automatically execute a shell command of
git rev-parse HEAD.
But this might not work if your copy of the files (that you're running grymt
on) isn't in a git repository.
So, the solution is instead to supply it on the command line like this:
grymt --git-revision e30a0a52f6f5223ec043056a55d05aa53d33b508 ./somedirectory
Uglifyjs instead of jsmin
The advantage of
jsmin is that it's really easy to install and use
and it's in Python.
The advantage of
uglifyjs is that it's much better at optimizing the
grymt tries to use
uglifyjs on the command line and if
it's not available or executable, it falls back on