Is this library redundant with "font-display"?

[garygreen]

Now that browser support for font-display is pretty good which is supported in Chrome, Firefox, Safari, iOS (though no IE11 + Edge) - would you still recommend to use this library?

It would be good if the docs could comment on when this library is useful compared to font-display - personally I've had trouble implementing this library (with local storage caching) and still cannot prevent FOUT, but font-display works perfectly.

[macgyver]

my personal intuition is that combining:

1. rel=preload http header for each of the fonts you want to preload (or <link rel=preload> early in the markup if modifying headers is not possible)
2. font-display in your css

will yield better results for browsers that correctly implement the web standards, but "better" is subjective and probably depends a lot on your personal preferences and use cases.

I feel like FFO will produce a more consistent experience across browsers, but it's definitely a bit more complicated to use and adds a small hit in terms of script parsing and execution time.

(these are just feelings, no real world examples!)

[garygreen]

Thanks for the comment. It's also worth noting there is an offical draft spec for promise-based font loading, maybe this library could act as some polyfill.

Support is pretty decent:

https://developer.mozilla.org/en-US/docs/Web/API/FontFace/load

[macgyver]

One major advantage of FFO just occurred to me - you can wait for all the fonts you care about to load before applying any of them. If you have a lot of fonts, it seems beneficial from a user perspective to do one big sweep of the document vs. adding them incrementally as they load in (depending I guess on personal preference/design direction).

I think you could code this yourself, especially with that FontFace.load method you mention, but at that point it seems like you've lost the ability to take advantage of rel=preload and you're scripting a somewhat complicated solution, so maybe just better to go with the tried and true FFO library.

[jonathanstegall]

I came to see if I could learn more about this now that Adobe Fonts has a font-display: swap; option. I was thinking about the sessionStorage technique that I'm using with Font Face Observer and realized that I'm not sure how font-display: swap works with browser caching.

I'm curious if there are additional cases beyond browser compatibility when it's beneficial to use this library instead of font-display: swap, and also if there are ever cases where it's worth using both?