当所有预取链接准备就绪时，如何通知？

问题描述

我有一个网页，其中head包含一些预取链接：

<link href="/fonts/my-font.ttf" rel="prefetch">

在JavaScript脚本中，我想在这些资源准备就绪时收到通知。

我不确定100％，但是以下代码似乎适用于预加载链接：

// When this promise resolves,we are sure that all resources are loaded
return new Promise(resolve => {
  if (document.readyState === 'complete') {
    resolve();
  } else {
    window.onload = resolve;
  }
});

我想做类似的事情，但是使用预取，因为当此承诺解决时，预取查询仍在运行。

解决方法

根据Resource Hints，对于发出的推测性提取请求（包括链接预提取），您可以期望看到load和error事件：

3.2加载和错误事件

用户代理不得延迟以下事件的加载事件： 由于未完成的预连接或推测性提取而导致的文档 发起的请求。

决定是否执行资源提示，如果执行， 是将全部处理还是部分处理推迟到用户 代理商。结果，元素级别的加载和错误JavaScripts事件 不保证会射击，如果射击了，则不保证射击完全 应用处理。但是，用户代理应该触发 在可能的情况下，适当的加载和错误事件，以允许 应用程序以跟踪执行了哪些提示以及何时执行。

但是请注意，整个过程取决于用户代理，不能保证任何东西的预取，并且请记住，用户可能会在各种浏览器中完全禁用预取。