【发布时间】:2022-08-16 16:24:43
【问题描述】:
当我的 Angular 应用程序在 Android 上的 Chrome 中运行或在 Windows 上的 Chrome 中以响应模式(开发工具)运行时,我遇到了缓慢但持续的内存泄漏。
这个问题似乎在任何角度应用程序中都是可重现的。所以下面的例子来自访问https://angular.io/。
重现步骤如下:
- 打开 Chrome 开发工具并开启响应模式
- 导航到https://angular.io/(注意开发工具中的 DOM 节点数)
- 点击菜单
- 点击“教程”->“教程:英雄之旅”->“5.添加导航”
- 单击“教程”->“教程:英雄之旅”->“6. 从服务器获取数据”
- 多次重复步骤 4 和 5
- 单击屏幕顶部的角图标返回主页面
- 执行 GC 并检查 DOM 节点数
预期结果
DOM 节点应定期进行垃圾收集。手动 GC 后 DOM 节点计数应该从第 2 步返回到原始值(或非常接近)。
此测试是在 Chrome for Windows (v99.0.4844.51) 中执行的响应模式关闭.
实际结果
DOM 节点永远不会被垃圾回收。因此 JS 堆大小不断缓慢增加。如您所见,仅在这两个链接之间导航,我就有超过 200k DOM 节点。 此测试在 Chrome for Windows (v99.0.4844.51) 中执行响应模式开启.
这里最大的问题是我们的应用程序主要在 Android 平板电脑上运行,而这种行为是我们一直在平板电脑上看到的。最终导致应用程序崩溃。
实际上,我必须以一定的时间间隔向应用程序添加强制刷新,以阻止应用程序硬崩溃,但这并不总是足以阻止应用程序崩溃。
似乎某些组件比其他组件更有可能导致此问题,但我无法确定根本原因。
另一个例子可以在这里找到:on this stackblitz
我不确定这是否是 Angular / Chrome 中的错误,或者是否还有其他仅在 Chrome 的移动/响应模式下发生的事情?
-
这里正在讨论这个或类似的问题:bugs.chromium.org/p/chromium/issues/…
标签: angular google-chrome memory-leaks angular-material