预加载、预取和其他链接标签

Avatar of Robin Rendle
Robin Rendle on

DigitalOcean 为您旅程的各个阶段提供云产品。立即开始使用 价值 200 美元的免费积分!

Ivan Akulov 收集了大量关于使用 preloadprefetch 使加载速度更快的知识和信息。这本身就很棒,但他还提到了我之前从未见过的东西 - as 属性

<link rel="preload" href="/style.css" as="style" />

据推测,这有助于浏览器优先考虑下载资产的时间以及要加载的资产。

我最喜欢的部分是 Ivan 在文章末尾的简要总结,它清楚地定义了所有这些不同的标签可以用于什么

<link rel="preload"> – 当您在几秒钟内需要资源时
<link rel="prefetch"> – 当您在下一页需要资源时
<link rel="preconnect"> – 当您知道您很快需要一个资源,但您还不知道它的完整 url 时

确保查看我们自己的关于 预取、预加载和预浏览 的文章。将这些内容添加到我们的链接中可以显着提高性能,因此请查看它以将更多资源添加到您的性能工具箱中。

直接链接 →