PageSpeed Insights complains that I should preload important assets, which I already do for CSS (http header Link: </assets/css/myfile.css>; rel=preload; as=style).
However, the complaints are specifically about web fonts. Indeed, these can currently download only after the (preloaded) CSS has been downloaded. The problem is that these fonts come in various variants (myfont.eot, myfont.svg, myfont.woff, myfont.woff2) and it is up to the client t decide which to download:
@font-face{
font-family:myfont;
src:url(/assets/font/myfont.eot);
src:url(/assets/font/myfont.eot) format('embedded-opentype'),
url(/assets/font/myfont.woff) format('woff'),
url(/assets/font/myfont.woff2) format('woff2'),
url(/assets/font/myfont.svg) format('svg');
...
So if I specifically preload the variant PageSpped Insights complains about, I make them happy but cause superfluous download for any client with a different font format preference.
Q: Is there any way to make a "variant-aware preload", i.e., instead of "download this file, you will probably need it in a moment, trust me" something like "download one of these files, whichever has the format you'd prefer for a font in case you need it later"?
