Question 1

How to use Fontmin to optimize fonts for a React app?

Accepted Answer

Integrate Fontmin into your build process (e.g., via a script or Gulp) to subset fonts based on your app's text content and convert them to WOFF2. Use the .glyph() plugin with the text from your components and chain format plugins for output.

Question 2

Fontmin vs fonttools: which is better for web font optimization?

Accepted Answer

Fontmin is more user-friendly for web-specific tasks like CSS generation and seamless integration into Node.js builds, while fonttools is a lower-level Python library with broader font manipulation features but requires more setup. Choose Fontmin for quick web optimizations.

Question 3

Can Fontmin handle variable fonts?

Accepted Answer

The README doesn't mention variable font support; it focuses on static formats like TTF and SVG. For variable fonts, you may need to use other tools or check if the underlying fonteditor library supports it, as Fontmin might not be ideal.

Question 4

How to embed fonts as base64 in CSS with Fontmin?

Accepted Answer

Use the .css() plugin with the base64 option set to true. This generates CSS that includes the font data inline as base64-encoded strings, reducing HTTP requests but increasing CSS file size, as documented in the plugin examples.

Question 5

Is Fontmin compatible with Webpack?

Accepted Answer

Yes, you can use Fontmin in Webpack via loaders or by running it as a post-build step. Its Node.js API allows integration into custom scripts, but there's no official Webpack plugin, so some configuration might be needed.

Question 6

How to reduce file size for Chinese fonts with Fontmin?

Accepted Answer

Subset the font using the .glyph() plugin with the text parameter containing the Chinese characters from your site. This extracts only those glyphs, drastically cutting size for character-rich fonts, as hinted in the CLI examples with web scraping.

fontmin

What is fontmin?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions