• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Implemented Font preload

CyberAP

Well-known member
#1
Right now font loading is postponed until CSS load, so it only starts loading font after all the CSS is loaded. This can be overridden with two simple attributes: rel="preload" and as="font" (the font request should be done explicitly of course). A little more on content preloading on MDN.

Little proof that it always loads font the last (and delays DCL event, notice High priority):

1509805546699.png

It's also the main reason of blinking icons on page refresh.
 

Chris D

XenForo developer
Staff member
#2
We've implemented some pre-loading of the woff2 version of the font if FA is hosted locally. Only the woff2 version because there's a correlation between rel preload support and woff2 support.

Browser support is pretty dire right now:
http://caniuse.com/#feat=link-rel-preload

It basically only works in Chrome (out of the browsers we've tested). Firefox are having trouble with their implementation so it doesn't appear to be working properly in 56, and it's disabled in 57 and 58. Although it claims Safari has support, it only does if you enable it under Experimental features.

It has been rolled out here though so you will see the difference in the network output.
 

CyberAP

Well-known member
#3
This is awesome! I am not getting icon font flashes anymore and font request is no longer blocking rendering.