javascript - 如何找出React Native应用程序中的内存泄漏？

Question

我已经在 React Native Android 中构建了一个学习管理系统应用程序。我使用 AsyncStorage 进行简单的状态管理，根本没有使用 redux。我现在面临的问题是，如果我我将通过执行不同的操作来连续使用该应用程序，然后该应用程序会变得非常慢。我认为这是内存泄漏，因为当我从后台杀死该应用程序并再次打开它时，它会毫无延迟地工作。所以我不知道如何避免这种内存泄漏。我尝试了很多解决方案

1. 从应用中删除了所有 console.log
2. 更改了所有内联样式
3. 使用 ComponentDidMount 而不是 ComponentWillMount。
4. 尝试预取数据。

但我不知道如何从堆内存中删除数据。每次导航时数据是否存储在堆中？所以这将使应用程序的性能非常慢。我不知道我是否正确。如果我的概念有任何错误，请原谅。现在没有时间将状态管理更改为 redux。请有人帮我找到解决方案，这将是一个很大的帮助。谢谢!

Answer 1

我遇到了同样的问题，有帮助的方法有:

使用转换删除控制台:

https://www.npmjs.com/package/babel-plugin-transform-remove-console

将其添加到您的 babel 生产插件中并安装它。它将隐藏生产中应用程序中的所有控制台日志。

添加安装状态

Specifically, calling setState() in an unmounted component means that your app is still holding a reference to the component after the component has been unmounted - which often indicates a memory leak!

https://reactjs.org/blog/2015/12/16/ismounted-antipattern.html

import React, { Component } from 'react';


class App extends Component {

  _isMounted = false;

  componentDidMount() {
    this._isMounted = true;
    // ... do your stuff here
  }

  componentWillUnmount() {
    // tells the component that component is now unmounted
    this._isMounted = false;
  }

  getUsersFromApi(){
    if(this._isMounted){
      // ... tasks
    }
  }

}

export default App;