preload links to my site for two CSS files, and this was by far the biggest improvement opportunity listed in the Lighthouse audit.
I added the
preload links, and ran a new Lighthouse audit, and it is still showing the same message as before (screenshot below).
The non-preload links for those same two files are still there, could that be what is causing this issue? Here are the first 4 lines in the
<head> <link type="text/css" rel="preload" href="/gsight2/css/invite.css?v1" as="style"> <link type="text/css" rel="preload" href="/gsight2/css/client-styles.css?v4" as="style"> <link type="text/css" rel="stylesheet" href="/gsight2/css/invite.css?v1"> <link type="text/css" rel="stylesheet" href="/gsight2/css/client-styles.css?v4">
Another potential issue here (that I admit I'm just now noticing) is that all four of those
<head> section come in first, and the after some time those four
<link> elements come in. That is especially noticeable when I do the same thing and simulate a slower connection.
In that case, I'm confused about the value of preloading that CSS at all, as it isn't needed in the initial render of the page.
Should I remove the two non-preload links? I left them because I figured it would be no harm, but maybe it is confusing Lighthouse.
Any tips here are appreciated, thanks in advance.