rel=preload for stylesheet isn't applying the styles once downloaded
What do you think about this approach:
<link rel="preload" href="style.css" as="style" onload="this.rel='stylesheet'">
Resource: https://www.filamentgroup.com/lab/async-css.html
You need to have 2 lines for each one with rel=stylesheet and one with rel=preload. As preload is just fetching it and not applying.
However you will probably not notice much performance improvement as it hits one line just before the other.
The better option is to inline the css (see here) that is seen above the fold then use javascript to add in the in the css file on page load (see here).