使用响应模式或在 Android 平板电脑上时出现角度内存泄漏
当我的 Angular 应用程序在 Android 上的 Chrome 中运行或在 Windows 上的 Chrome 中以响应模式（开发工具）运行时，我遇到了缓慢但持续的内存泄漏。
这个问题似乎在任何有角度的应用程序中都可以重现。因此，下面的示例来自访问 https://angular.io/。
重现步骤如下：
- 打开 Chrome 开发工具并打开响应模式
- 导航至 https://angular.io/ (记下开发工具中的 DOM 节点计数）
- 单击菜单
- 单击“Tutorials”-> 《教程：英雄之旅》-> “5.添加导航”
- 点击“教程”-> 《教程：英雄之旅》-> “6. 从服务器获取数据”
- 多次重复步骤 4 和 5
- 单击屏幕顶部的角形图标返回主页
- 执行 GC 并检查 DOM 节点数
预期结果
DOM 节点应该定期进行垃圾收集。手动 GC 后，DOM 节点计数应返回到步骤 2 中的原始值（或非常接近）。
此测试是在 Windows 版 Chrome (v99.0.4844.51) 中执行的，并且响应模式关闭。
实际结果
DOM 节点永远不会被垃圾回收。因此，JS 堆大小不断缓慢增加。正如您所看到的，仅通过在这两个链接之间导航，我就有超过 200k 的 DOM 节点。 此测试是在 Windows 版 Chrome (v99.0.4844.51) 中执行的，并且响应模式已开启。
这里的大问题是我们的应用程序主要在 Android 平板电脑上运行，而这种行为是我们在平板电脑上经常看到的。最终导致应用程序崩溃。
实际上，我必须以一定的时间间隔向应用程序添加强制刷新，以阻止应用程序发生硬崩溃，但是，这并不总是足以阻止应用程序崩溃。
似乎某些组件比其他组件更有可能导致此问题，但是我无法确定根本原因。
另一个例子可以在这里找到：在此 stackblitz
我不确定这是否是Angular / Chrome 中的错误，或者是否还有其他仅发生在 Chrome 移动/响应模式下的情况？
I am experiencing a slow but continual memory leak in my angular app when it is running in Chrome on Android or when running in Chrome on Windows in responsive mode (dev tools).
The problem is reproducable in any angular application it seems. So the example below is from visiting https://angular.io/.
Steps to reproduce are:
- Open Chrome dev tools and turn on responsive mode
- Navigate to https://angular.io/ (Take note of the DOM Node count in the dev tools)
- Click the menu
- Click "Tutorials" -> "Tutorial: Tour of Heroes" -> "5. Add Navigation"
- Click "Tutorials" -> "Tutorial: Tour of Heroes" -> "6. Get Data from a Server"
- Repeat steps 4 and 5 a bunch of times
- Click the angular icon at the top of the screen to return to the main page
- Perform a GC and check the DOM node count
Expected outcome
DOM nodes should be garbage collected regularly. After a manual GC DOM node count should return to the original value from step 2 (or very close to it).
This test was performed in Chrome for Windows (v99.0.4844.51) with responsive mode off.
Actual outcome
DOM nodes are never garbage collected. Thus the JS heap size continually increases slowly. As you can see I'm over 200k DOM nodes just from navigating between these two links.
This test was performed in Chrome for Windows (v99.0.4844.51) with responsive mode on.
The big problem here is that the app we have runs primarily on Android tablets and this behaviour is what we are seeing on the tablets all the time. Eventually it causes the app to crash.
I've actually had to add a force refresh into the app at certain intervals to stop the app from just hard crashing but, this is not always enough to stop the app from crashing.
It seems certain components are more likely to cause this problem than others but, I have not been able to identify a root cause.
Another example can be found here: on this stackblitz
I'm not sure if this is a bug in Angular / Chrome or is there something else going on that only occurs on mobile/responsive mode for Chrome?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论