小编Kev*_*tel的帖子

如何防止 Angular 中的内存泄漏

我们有一个具有复杂且冗长视图的应用程序。一个视图大约有 50 个具有自己的服务、订阅和行为的组件。组件有自己的变量,包括数组和表单组。

问题:从 View2(Component2) 导航回 View1(Component1) 后,我仍然在 chrome devtool 的“内存”选项卡中看到 View2(Component2) 的数据,并且每次快照中都会增加 25 MB 内存。

例如:

  • View1 的第一次快照 --> 50 MB
  • 导航至视图 2。导航到 View1 --> 快照大小为 75 MB
  • 导航至视图 2。导航到 View1 --> 快照大小为 100 MB

每次,当我导航到 View2 时,加载时间都会增加 4-5 秒。我正在清除 View2 的所有订阅,但在导航 View1 后,它仍然向我显示所有数组和 FormGroup、View2 组件、带有数据的变量。

我期望从 View2 导航后 View1 应该具有相同的大小。

我创建了小型应用程序,结果是相同的,

[![在此处输入图像描述][1]][1]

这是预期的行为还是我需要采取一些措施?

在实际应用中,我在导航回 View1 后看到下面的快照。 在此输入图像描述

我可以看到所有 FormGroup,以及先前视图的数组。

google-chrome heap-memory google-chrome-devtools angular

5
推荐指数
1
解决办法
8925
查看次数