javascript - NavigationTimingAPI 可以用于异步调用吗？

Question

我目前正在使用自定义元素 v1 的项目中实现性能测量功能。

NavigationTimingAPI提供对不同导航类型(导航、重新加载、浏览器后退/前进)的非常详细的测量:

是否也可以为异步调用提供相同(或类似详细信息)？或者是否还有另一个我不知道的 API？

也就是说，当页面完全加载并且某些用户交互或事件触发服务器上的资源上的 POST 或 GET 时。

到目前为止我发现的唯一的事情是使用 performance.mark() 设置测量点.

我在这里错过了一些重要的东西吗？

Answer 1

您命名了导航计时，并通过performance.mark()找到了用户计时，但错过了Resource Timing API 。这三个都是性能计时 API 的一部分。

导航时间衡量主页或应用程序。 资源计时 API 类似，但它是为每个单独的异步加载资源提供的，以便将它们与导航时间进行比较。

想一想:异步加载的文件没有 DOM 可以运行!这意味着资源计时中缺少 dom-properties。但开始部分与导航计时相同:

性能计时 API 最重要的属性 startTime 怎么样？每个异步调用都有自己的!对于文档，startTime 为 0 毫秒；对于 Javascript 文件和资源，startTime 为 0 毫秒。

startTime 是第一个记录的时间戳 - 度量的起源。它标志着浏览器第一次开始加载资源过程的时间。在资源计时startTime is same as fetchStart or redirectStart (if not zero)计时资源时。

CSS 或图像等资源既没有 dom 也没有执行，但带有 .js 扩展名的资源执行 Javascript，因此可以使用 performance.mark() 进行用户计时正如您已经发现的那样。

• Can the NavigationTimingAPI be used on asynchronous calls?

是和否。资源计时会自动获得标记，这些标记可以与导航计时相关，从而进行非常有用的比较。所以是的 - 但不是:测量index.html(导航)和测量异步调用(资源)是不一样的:
将 performance.getEntriesByType("navigation") 更改为 performance.getEntriesByType("resource")。