React 通用 redux-saga 内存泄漏

Posted 2023-02-19

【中文标题】React 通用 redux-saga 内存泄漏

【英文标题】：React universal redux-saga memory leak

【发布时间】：2018-10-19 17:45:25

【问题描述】：

我正在开发一个使用 redux 和 redux-saga 的 React 同构应用程序。 我的问题是运行应用程序的节点进程在处理请求时会占用越来越多的内存，直到最终内存不足。

我使用 node --inspect 分析了应用程序，并注意到 saga 库不断在内存中创建 (array) 类型引用，即使在垃圾收集运行之后也不会被清除。

要测试问题，请运行此项目并使用 chrome-devtools 对其进行分析： https://github.com/MartinCerny-awin/isomorphic-react-redux-saga-s-s-r

（不是我的项目，但它的行为方式似乎相同）

您可以在堆差异中看到这些对象： updateState in system / Context @1770579context in cancel()

我尝试将 redux 存储和 saga 中间件绑定到 express response，认为这是请求命名空间问题，但这并不能解决问题。

【参考方案1】：

Redux saga task cancellation 将防止内存泄漏。

取消组件卸载/路线更改的 SAGAS

我认为问题在于在与 saga 关联的组件卸载后，您没有取消 saga。这可能会导致内存泄漏，因为 saga 一直在等待操作并且不会终止。

    import  LOCATION_CHANGE  from 'react-router-redux';
    // other imports

    function* rootSaga() 
      const watcher = yield [
        takeLatest(GET_TODO, getToDoSaga),
        // your other sagas
      ];

      // the saga gets cancelled when your route changes. Instead 
      // a custom action can also be dispatched from your
      // componentWillUnMount of ToDo component
      yield take(LOCATION_CHANGE); 
      yield watcher.map((task) => cancel(task));
    

    export default [
      rootSaga,
    ];

【讨论】：

这里所有的 sagas 都被取消了：github.com/MartinCerny-awin/isomorphic-react-redux-saga-s-s-r/…

另外，内存泄漏仅在服务器上很明显，前端没有问题