4 ms·

"Automatic Inlining of Fonts" seems like a pretty huge deal to me (considering, of course, that the framework is stable and huge stylistic changes like react ho

"Automatic Inlining of Fonts" seems like a pretty huge deal to me (considering, of course, that the framework is stable and huge stylistic changes like react hooks are in fact not what you want out of a stable framework but mostly a display of its immaturity – even if the feature itself is great). Do any of the competitors include something similar?

speedgoose 6y ago
I'm not sure what they mean about font inlining, I didn't read the code. But if it's about having the font directly in the bundle encoded in base64 to save a http request, you can do that with webpack for example. But from what I understood, base64 encoded content is often slower to load than the same content served over http 2. I don't know if others are automatically downloading the fonts to include them in the build. It's a nice feature but you can also install many Google fonts from Npm.
- IggleSniggle 6y ago
  If the font is already loaded, then inlining is hurting rather than helping. Browsers will cache fonts and external libraries between sites when they are identical, so your users might even already have the font loaded: by inlining, you've forced them to load it again, even if they already had it in their local cache.
WorldMaker 6y ago
Inlining styles is download of a couple files and then a couple lines of webpack config. Almost all the competitors either already support it when you include the download file in your assests or just tell you to make the changes to your webpack config (or eject and do it in the case of something like Create React App). I guess the "innovation" here is that they also support the download step? Either way, fonts are bulky binaries that don't gzip well but do cache well in browsers when combined with central CDNs so this seems an anti-feature for reasons other commenters point out. Most common fonts are going to be faster to paint from the cached CDN than letting it bloat your bundle sizes.

speedgoose 6y ago

I'm not sure what they mean about font inlining, I didn't read the code. But if it's about having the font directly in the bundle encoded in base64 to save a http request, you can do that with webpack for example. But from what I understood, base64 encoded content is often slower to load than the same content served over http 2. I don't know if others are automatically downloading the fonts to include them in the build. It's a nice feature but you can also install many Google fonts from Npm.

IggleSniggle 6y ago
If the font is already loaded, then inlining is hurting rather than helping. Browsers will cache fonts and external libraries between sites when they are identical, so your users might even already have the font loaded: by inlining, you've forced them to load it again, even if they already had it in their local cache.

WorldMaker 6y ago

Inlining styles is download of a couple files and then a couple lines of webpack config. Almost all the competitors either already support it when you include the download file in your assests or just tell you to make the changes to your webpack config (or eject and do it in the case of something like Create React App). I guess the "innovation" here is that they also support the download step? Either way, fonts are bulky binaries that don't gzip well but do cache well in browsers when combined with central CDNs so this seems an anti-feature for reasons other commenters point out. Most common fonts are going to be faster to paint from the cached CDN than letting it bloat your bundle sizes.