@funboxteam/beatrix
Advanced tools
Changelog
3.0.1 (20.06.2023)
Fixed the way Beatrix works with file paths, just to be sure that it won't blow up the directories outside of its domain.
Also ensured that the tool works properly on Node.js 18.
Readme
Users spend a lot of time downloading web assets: JS, CSS, images, fonts, etc. To reduce waiting time, developers compress the assets, gzip them, use optimized formats for images and fonts.
But sometimes the developers can go a little bit further. When they have all the rights for fonts they use, it's possible to leave only the glyphs their website needs. Just cut off the rest ones.
That's exactly how the tool works.
First of all, the tool is a wrapper around Python scripts distributed as fonttools. You should install them and the deps they need to:
pip install fonttools zopfli brotli
Then you can install Beatrix:
npm install --save @funboxteam/beatrix
Now you're ready to optimize your fonts.
Beatrix expects to get a path to directory with TTF/OTF files inside and the config with allowed characters listed.
E.g. if you clone this repo and install the tool, you will be able to run it like this:
beatrix --config ./example/config.js --output ./dist ./example
It will load ./example/config.js, find all the TTF/OTF files inside ./example, optimize & convert them to WOFF & WOFF2,
and put the results into ./dist.
$ beatrix --config ./example/config.js --output ./dist ./example
Output dir cleared.
------------------------
Start processing '/tmp/beatrix/example/Roboto/bold--italic.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 171 Kb → 33 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/bold--italic.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/bold.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 167 Kb → 32 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/bold.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/light--italic.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 173 Kb → 34 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/light--italic.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/light.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 167 Kb → 32 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/light.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/regular--italic.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 170 Kb → 33 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/regular--italic.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/regular.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 168 Kb → 32 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/regular.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/thin--italic.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 172 Kb → 34 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/thin--italic.ttf'.
------------------------
Start processing '/tmp/beatrix/example/Roboto/thin.ttf'...
Dest dir created: '/tmp/beatrix/dist/Roboto'.
TTF subset: 168 Kb → 32 Kb (−80%).
TTF created.
WOFF created.
WOFF2 created.
Completed processing '/tmp/beatrix/example/Roboto/thin.ttf'.
------------------------
Done.
Config is a JS or JSON file which describes an object containing CHARACTERS and LAYOUT_FEATURES.
CHARACTERS is an array, where each item is a string describing one Unicode number or a range of them.
Each Unicode number is represented as 4 hex digits.
LAYOUT_FEATURES is an array of OpenType features (e.g., kern, liga, tnum, etc.).
Please note that if no config provided, the default config is used. If one of the options is not present in the config, the appropriate option from the default config is used.
Example:
module.exports = {
CHARACTERS: [
// Unicode range from U+0020 to U+007E (including the last one).
// Contains: space, !, ", #, $, %, &, ', (, ), *, +, comma,
// -, dot, /, numbers, :, ;, <, =, >, ?, @, A-Z, [, \, ], ^,
// _, `, a-z, {, |, }, ~
'0020-007E',
// One Unicode number
// non-breaking space
'00A0',
// One more Unicode number
// ©
'00A9',
// ...
],
// Drop all the features except 'tnum' and 'kern'
LAYOUT_FEATURES: ['tnum', 'kern']
}
The characters and features described above will be left in the font files, all the rest will be cut off.
If you want to remove all the characters or features completely just pass an empty array.
FAQs
A tool for converting and optimizing font files
We found that @funboxteam/beatrix demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
ESLint has approved an RFC that adds support for TypeScript configuration files, which is aimed at improving the developer experience and recognizing changes in the evolving JavaScript ecosystem.
Security News
The NVD is facing a significant backlog with over 12,500 CVEs awaiting analysis, and more than 50% of known exploited vulnerabilities (KEVs) left unenriched since mid-February.
Security News
Ransomware costs victims an estimated $30 billion per year and has gotten so out of control that global support for banning payments is gaining momentum.