如何检测Angular应用程序中与rxjs相关的内存泄漏 [英] How to detect rxjs related memory leaks in Angular apps
问题描述
是否有任何工具或技术可以检测遗留或当前活着的可观察量,订阅。
Is there any tool or technique to detect "left behind" or "currently alive" observables, subscriptions.
最近发现了一个非常令人讨厌的内存泄漏,组件是因缺少取消订阅电话而保持活力。我读到了关于takeUntil的方法,看起来还不错。
https://stackoverflow.com/a/41177163/2050306
Just recently discovered a pretty nasty memory leak where components were kept alive due to missing "unsubscribe" calls. I read about "takeUntil" approach which seems pretty good. https://stackoverflow.com/a/41177163/2050306
然而,我仍然想知道是否有任何工具(浏览器扩展等)。据我所知,Augury不会涵盖这个区域。
However I'm still wondering is there any tool (browser extension etc.) for that. Augury does not cover this area as far as I know.
非常感谢所有输入。
推荐答案
免责声明:我是下面提到的工具的作者。
Disclaimer: I'm the author of the tool I mention below.
这可以通过保留添加新订阅的列表来实现取消订阅后,从此列表中删除订阅。
This can be accomplished by keeping a list where new subscriptions are added to, and removing subscriptions from this list once it is unsubscribed.
麻烦的部分是观察订阅。一种直接的方法是通过猴子修补 Observable#subscribe()
方法,即替换Observable原型方法。
The troublesome part is observing subscriptions. A straightforward way to achieve this is by monkey-patching the Observable#subscribe()
method, that is, replacing the Observable prototype method.
这是 observable-profiler 的总体方法,挂钩到Observable库(即rxjs)并在控制台中打印泄漏订阅的工具。
This is the overall approach of observable-profiler, a development tool which hooks into an Observable library (i.e rxjs) and prints leaking subscriptions in console.
使用探查器的一种简单方法是在应用程序启动后开始跟踪,然后一段时间后停止跟踪:
A simple way to use the profiler is start tracking once the app is bootstraped, then stop tracking after a time:
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,
});
}
});
只需在devtools控制台中调用 stopProfiler()
一旦你想要一份报告。
Just call stopProfiler()
in devtools console once you want a report.
这篇关于如何检测Angular应用程序中与rxjs相关的内存泄漏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!