如何使用 performance.measureMemory() API 进行前端可观察性？

Posted 2023-03-31

【中文标题】如何使用 performance.measureMemory() API 进行前端可观察性？

【英文标题】：How do I use performance.measureMemory() API for frontend observability?

【发布时间】：2020-11-10 05:29:52

【问题描述】：

我希望在不同客户端上以固定的时间间隔跟踪我们的应用程序/网页的内存消耗。我的团队希望观察这个指标，以了解是否有任何新功能的推出对应用程序消耗的内存有重大影响，如果有，则回滚该功能。

我已经阅读了这些来源：

https://web.dev/monitor-total-page-memory-usage/ https://trackjs.com/blog/monitoring-javascript-memory/ https://developer.mozilla.org/en-US/docs/Web/API/Performance/memory https://wicg.github.io/performance-measure-memory/ https://github.com/WICG/performance-measure-memory

首先，如果我们查看旧 API：window.performance 用户必须通过使用“--enable-precise-memory-info”标志启动 Chrome 来启用准确的内存监控。对我来说，期望我们的用户使用这个标志运行 Chrome 似乎是不合理的。

我还读到这个 ​​API 可能超过或低于测量内存消耗，因为它测量 JavaScript 堆的大小，如果有 iframe 或服务工作者启动不同的堆，或者有任何大型网页，这可能是不正确的在同一个堆上。

由于这两个原因，对于生产中真实客户端的前端可观察性目标而言，此选项不是有效选项 (imo)。

其次，如果我们看一下新的 API：performance.measureMemory()。

它仅在 2021 年 1 月之前通过原始试用版提供（根据我注册令牌时表格告诉我的内容）。

除了在开发机器上进行本地分析之外，这似乎是目前实现上述目标的唯一选择（或者我的假设是否有误？）。

关于 API 的使用，我有两个问题：

我们在 2021 年 1 月之后是否有任何替代方案（这在 1 月之后是否不可用）？ 我可以通过启用标志在我的本地测试这个：#enable-experimental-web-platform-features 没有任何问题。我有一个原始试用令牌，如果我将其作为元标记添加到我的index.html，我的用户是否需要在他们的浏览器上启用任何标志才能让我们观察到这一点？

【参考方案1】：

我联系了measure memory API w3c specification 的编辑，他很友好地及时回复了我。

我现在在这里发布我通过电子邮件收到的答案，以防其他人来寻找这个：

我们在 2021 年 1 月之后是否有任何替代方案（这在 1 月之后是否不可用）？

我们计划在 Chrome 89 中发布它。出于安全原因，它将由 self.crossOriginIsolated 保护。当前在 origin 试用版中发布的版本不需要跨域隔离。

我可以通过启用标志在我的本地进行测试：#enable-experimental-web-platform-features 没有任何问题。我有一个原始试用令牌，如果我将它作为元标记添加到我的 index.html，我的用户是否需要在他们的浏览器上启用任何标志才能让我们观察到这一点？

如果您添加元标记，则用户不需要任何标志。请注意，如果没有 --enable-blink-features='ForceEagerMeasureMemory'，可能需要一段时间（最多 20 秒）才能解决带有结果的承诺。这是因为 API 会等到下一次垃圾回收再执行测量。