The link preload is not avoiding the font loading duplication The link preload is not avoiding the font loading duplication google-chrome google-chrome

The link preload is not avoiding the font loading duplication


I solved the issue adding type="font/woff2" crossorigin="anonymous"

<link rel="preload" href="/css/fonts/XRXV3I6Li01BKofINeaB.woff2" as="font" type="font/woff2" crossorigin="anonymous">

Fonts are indeed a special case

If you've got your sites' CORS settings worked out properly, you can successfully preload cross-origin resources as long as you set a crossorigin attribute on your element.

One interesting case in which this applies even if the fetch is not cross-origin is font files. Because of various reasons, these have to be fetched using anonymous mode CORS (see Font fetching requirements if you are interested in all the details).