本文将帮助您了解DNS预取,一种资源提示,包括它们是什么、为什么以及如何使用它们,以及审计和扩展它们的最佳实践。 DNS预取的工作原理 DNS预取是一种资源提示,用于对浏览器尚未确定需要进行的域进行DNS查找。这可以提高性能,因为当浏览器确实需要请求资源时,该域的DNS查找已经发生。 让我们看一个例子。浏览器正在加载页面,需要请求资源https://stats.example.com/js/pinit.js。为此,它首先必须与域stats.example.com建立HTTP连接。如果浏览器已经与域建立了HTTP连接,则可以使用现有连接,否则将创建新连接。 为此,浏览器首先对stats.example.com进行DNS查找。在下面的屏幕截图中,您可以看到对pinit.js的请求: 该资源后来在瀑布中被发现,并且JavaScript文件位于另一个域中,与基本HTML页面的域分开。现有的HTTP连接不存在,因此会进行DNS查找,如瀑布中资源栏的深绿色部分所示。这大约需要40毫秒,尽管DNS查找可能需要数十甚至数百毫秒,具体取决于网络连接或需要联系的DNS服务器数量等情况。 我们可以通过在HTML文件的<head>中添加DNS预取资源提示来优化这一点,如下所示: <link href=”https://stats.example.com/”> 在下面的屏幕截图中,您可以看到浏览器被指示主动尝试对pinit.js所在的stats.example.com进行DNS查找: 当浏览器稍后确定它需要请求pinit.js并连接到stats.example.com时,DNS查找已经发生。这允许JS文件更快地下载,将整个瀑布流向左移动。 DNS预取和预连接 DNS Prefetching是网站可以用来指示浏览器先做某事的多种资源提示之一。它是一个很小的、相当基本的资源提示,可以比其他选项更广泛地应用它。 您不需要同时指定DNS预取和预连接资源提示。浏览器只需预连接即可完成所需的所有步骤。 DNS预取仍然很重要,可以与预连接提示结合使用。这是因为浏览器限制了它们将维持的HTTP连接数。使用超过6-8个预连接资源提示可能会限制浏览器进行他们实际需要的连接。DNS预取在不同的级别上运行,这意味着您可以在页面上对关键域进行6到8个预连接,然后对其他不太重要的域有额外的DNS预取提示。 何时使用DNS预取 一般来说,DNS预取应该用于重要的第一方域和第三方域,包括: 后来在瀑布中发现的领域 具有随后导致其他请求发生的资源的域 具有大量请求或下载大量内容的域 域尚未被其他类型的资源提示使用 通常,DNS预取不应用于作为关键渲染路径的一部分的域。这是因为,理想情况下,这些域应该使用预连接资源提示。 DNS预取和第一方域 出于多种原因,对第一方域使用DNS Prefetch往往很容易: 您控制域名。 您有目的地在该域上托管内容并链接到它的页面。 您应该提前知道页面将使用哪些第一方域。 域名不太可能改变。 这些因素使您可以在一定程度上确信域包含页面所需的资源并且它们不太可能更改,从而包含DNS预取资源提示。很好的例子包括: 具有延迟加载的图像或视频的其他域 稍后在页面中使用的API端点的第一方域 第三方内容和DNS预取 由于多种原因,对第三方域使用DNS预取资源提示可能非常具有挑战性: 域名可能是动态的或在您不知情的情况下更改 不同的第三方域可能用于您网站的不同部分 可能不清楚哪些第三方内容是从哪些域加载的,因此添加或删除第三方标签可以添加或删除需要 DNS 预取的域 第三方域可能由于其他部门的操作而出现,例如使用标签管理器的营销或业务组。 您可能需要做额外的工作来确定第三方内容的来源。理想情况下,您希望对第三方内容使用 DNS 预取,这些内容将被您的页面长期使用。 以下是与 DNS 预取一起使用的第三方内容的良好示例,因为它们往往具有一致的域或 URL: 分析或活动跟踪器 A/B测试小工具 聊天小工具 错误和日志框架 社交分享小工具 使用资源提示优化广告可能特别困难。这是因为,虽然最初的广告交易平台可能有一个众所周知的域名,但为广告服务的最终域名通常是未知且不一致的。 验证好处 […]

