Как обнаружить утечки памяти, связанные с rxjs в приложениях Angular

Question

Существует ли какой-либо инструмент или метод для обнаружения «оставленных позади» или «в настоящее время живых» наблюдаемых, подписок.

Совсем недавно обнаружена довольно неприятная утечка памяти, когда компоненты оставались в живых из-за пропущенных вызовов «отписаться»,Я читал о подходе takeUntil, который кажется довольно хорошим.https://stackoverflow.com/a/41177163/2050306

Однако мне все еще интересно, есть ли какой-нибудь инструмент (расширение браузера и т. Д.) Для этого.Насколько я знаю, Огюри не охватывает эту область.

Весь вклад очень важен.

Answer 1

Отказ от ответственности: я являюсь автором инструмента, о котором я упоминаю ниже.

Это можно сделать, ведя список, в который добавляются новые подписки, и удаляя подписки из этого списка после его отмены.

Проблемной частью является соблюдение подписок.Прямой способ добиться этого - сделать исправление обезьяны методом Observable#subscribe(), то есть заменить метод прототипа Observable.

Это общий подход 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,
            });
        }
    });

Просто позвоните stopProfiler() в консоли devtools, как только вы захотите получить отчет.