我正在使用Chrome中的Lighthouse Dev工具分析我的电子商务网站。它建议我预加载一些CSS文件以消除渲染阻塞资源。
为什么要使用以下代码链接 CSS：
<link rel="preload" as="style" href="Styles/site.css" />
而不是使用：
<link rel="stylesheet" href="Styles/site.css" />
但是当我更新代码时，页面无法加载，并且在控制台中收到警告：
资源http：//..../Styles/site.css是使用链接预加载预加载的，但在窗口加载事件后的几秒钟内未使用。请确保它具有适当的"as"值，并且是有意预加载的。
此问题与 chrome 有关。Chrome 中未使用的预加载将在加载后 ~3 秒触发控制台警告。当资源未被及时消耗(例如，您没有尝试使用已预加载的脚本(时，就会发生这种情况。
如果当前导航需要该资源并且将使用，请进行预加载。如果需要超出此范围的资源(并且您没有在当前导航中使用(，我会进行预取。
您可以参考以下链接以获取更多详细信息：
https://developer.mozilla.org/en-US/docs/Web/HTML/Preloading_content
https://learn.microsoft.com/en-us/iis/get-started/whats-new-in-iis-10/http2-on-iis