我有一个网站,有一个外国的iframe。有多个第三方脚本在此外部 iframe 中运行。
我知道如果我从主窗口prefetch
这些脚本 - iframe 将需要重新加载这些源(因为prefetch
是在不同的域中完成的(。
如果我在主窗口中为第三方脚本添加dns-prefetch
或preconnect
资源提示,在 iframe 中加载这些脚本的性能会得到改善,原因是什么?这仅仅是因为我预热剧本吗?
某些浏览器出于隐私原因实现了双键 HTTP 缓存,以防止跟踪。这意味着,如果domain1从CDN加载jQuery,然后domain2从同一域加载相同的jQuery资源,它将再次下载,而不是从HTTP缓存中重用相同的副本。
Safari已经这样做了一段时间,Chrome最近表示他们也会这样做。
这意味着您无法按照声明在外部域 iframe 中prefetch
或preload
资源和脚本。
dns-prefetch
和preconnect
没有这样的隐私影响(目前 - 请参阅下面的Andy的回答,了解预连接即将发生的潜在更改(。 因此,它们可以通过预先加载一些工作来获取这些脚本来提高 iframe 的性能(尽管应该注意的是,浏览器可能并不总是使用相同的连接
preconnect
的使用(。连接池也可能变成双键 – https://github.com/whatwg/fetch/issues/917
在这种情况下,dns-prefetch
是可以的,但 iframe 中引用的资源的顶部帧原点的preconnect
不会,因为顶部帧原点将与 iframe 原点不同
不过,iframe 的内容仍然应该能够建立自己的预连接——使用 link 元素或 HTTP 标头
(添加为新答案,因为评论不能有换行符(