如何检测Angular应用程序中与rxjs相关的内存泄漏

rob*_*ert 20 javascript rxjs typescript angular rxjs6

是否有任何工具或技术来检测"留守"或"当前活着"的可观察量,订阅.

刚刚发现一个非常令人讨厌的内存泄漏,其中组件由于缺少"取消订阅"调用而保持活动状态.我读到了关于"takeUntil"的方法,看起来还不错. /sf/answers/2882401441/

但是我仍然想知道是否有任何工具(浏览器扩展等).据我所知,Augury并未涵盖这一领域.

所有输入都非常感谢.

And*_*ang 11

免责声明:我是下面提到的工具的作者。

这可以通过以下方式实现:保留一个添加了新订阅的列表,并在取消订阅后从该列表中删除订阅。

麻烦的部分是观察订阅。实现此目的的一种直接方法是通过猴子修补该Observable#subscribe()方法,即替换Observable原型方法。

这是observable-profiler的整体方法,observable-profiler是一种开发工具,可以挂接到Observable库(即rxjs)中并在控制台中打印泄漏的订阅。

一种简单的使用事件探查器的方法是在启动应用程序后开始跟踪,然后在一段时间后停止跟踪:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { Observable } from 'rxjs';
import { setup, track, printSubscribers } from 'observable-profiler';

setup(Observable);
platformBrowserDynamic([])
    .bootstrapModule(AppModule)
    .then(ref => {
        track();
        window.stopProfiler = () => {
            ref.destroy();
            const subscribers = track(false);
            printSubscribers({
                subscribers,
            });
        }
    });
Run Code Online (Sandbox Code Playgroud)

stopProfiler()需要报告后,只需在devtools控制台中调用即可。