resource-loader icon indicating copy to clipboard operation
resource-loader copied to clipboard

Feature request: Font loading via CSS Font Loading API

Open qtiki opened this issue 5 years ago • 4 comments

It would be nice if the resource-loader supported dynamic font loading "out of the box". Currently loading dynamic fonts requires the use of an external package like https://github.com/typekit/webfontloader.

Loading fonts could be implemented with the new CSS Font Loading API: https://developer.mozilla.org/en-US/docs/Web/API/CSS_Font_Loading_API

I know the technology is still experimental but the compatibility chart is already pretty good and hopefully will get better with time (Edge at least should be pretty 1:1 with Chrome now that they're switching to Webkit).

qtiki avatar Dec 09 '19 13:12 qtiki

I'm open to giving this a shot again now that browser tech has moved forward a bit.

In the past I've avoided it because of just how complex font loading is. So complex that it would more than double the size of the library just to handle font edge cases.

I wonder if it makes sense to have a separate plugin that adds font support to resource loader, rather than building it in the lib here given how much code seems to be required.

All that being said it has been a while since I looked into this problem space and the state of browsers so I'll at least do some investigation and see where we are. Or if your up to it, PRs are always welcome!

edit: one other complexity is that we support back to ie9 currently, so adding font support would need to support back to that browser as well. Even if we use a modern api we still have to write the fallbacks.

englercj avatar Dec 11 '19 02:12 englercj

I think all you need is a Strategy around FontFaceObserver: https://github.com/bramstein/fontfaceobserver It supports old browsers and also is very lightweight

creativefctr avatar Feb 03 '20 10:02 creativefctr

PRs welcome.

englercj avatar Feb 07 '20 00:02 englercj

+1 to this concept - the Venn diagram of resource-loader users who also need to load fonts is likely a circle. :-) Happy to help test if someone with a better understanding of the internals is willing to take a shot.

irongaze avatar Feb 24 '20 15:02 irongaze