为什么给关键CSS文件添加了preload链接标签后加载速度反而变慢了？

我在优化网站首页加载时，给关键CSS文件加了preload标签：<link rel="preload" href="/styles/main.css" rel="external nofollow" rel="external nofollow" rel="external nofollow" >，但监控显示首屏渲染反而比之前慢了0.5秒。明明这个CSS是首屏必须的，

试过把属性改成as="style"和添加crossorigin都没改善。在Chrome网络面板里看到这个CSS确实被提前加载了，但DOMContentLoaded时间反而推迟了。是不是preload用法哪里有问题？

相关代码片段：

<link rel="preload" href="/styles/main.css" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  as="style">
<link rel="stylesheet" href="/styles/main.css" rel="external nofollow"  rel="external nofollow"  rel="external nofollow"  crossorigin>

服务器响应头里也没有设置字段，这会不会影响资源使用？其他资源的preload都没问题，就这个CSS特别奇怪。