search

Workshape / icon-font-generator

Easy-to-use, pre-configured cli tool to generate webfont icon kits from a bunch of .svg files
MIT License
471 stars 76 forks source link

Feature request: base64 encoding #44

Closed delicatesther closed 5 years ago

delicatesther commented 6 years ago

Hi, Is there any possibility to base64 encode the icon font to CSS as well? The lack of http requests is always a big plus.

tancredi commented 6 years ago

Hi @delicatesther - currently not, but you could do that using another tool for embedding base64 assets on the generated font (e.g. a loader which resolves assets as base64 if using Webpack) and including the CSS file from your main CSS module. May be a good idea for the future though.

On a separate note (about saving on http requests), since it's a topic I'm interested in I may chip in my 5 cent. :) my understanding is that while http2 hugely optimised on the overheads created by opening multitudes of http requests, inlining fonts and assets bring a number of side effects - e.g. fonts get loaded even when not used, the browser caches less effectively and your cachebusting becomes less granular, since the whole bundle will be versioned alltogether. Also loading time of assets doesn't block page rendering while loading time of CSS does.

Another thing would be that you probably want your browser to only load its preferred / compatible format (you have woff / woff2 / svg / ttf / ..) and you definitely don't wanna be inlining the whole lot.

delicatesther commented 5 years ago

Ah I missed your reply. Thanks for your 5 cents! I did end up using something else for base64 encoding. I agree that inlining everything may work against you instead of for you, but when the icons you integrate are not too bulky, you do gain a lot in reliability in displaying them.