在Angular 7应用程序上，每次调用Web API的速度越来越慢

Question

我的Angular c＃应用程序调用了Web API，并访问了存储的proc。该应用程序的C＃部分执行速度很快，但是每次调用时“内容下载”的速度越来越慢。

我有一个调用Web API的Angular服务；

getInvestorsToFunds(params): Observable<InvestorToFund[]> {  
    let body = JSON.stringify({ params });  
    return this.http.post<InvestorToFund[]>(this.baseUrl + 'api/Investor/getInvestorsToFunds', body)   
     .pipe(catchError(this.handleError));
 }

然后从组件中调用它；

 let x = forkJoin(  
  this.investorService.getInvestorsToFunds(params)
).subscribe(t => { 
  this.investorToFunds = t[0] as InvestorToFund[]; 
});

关于每个通话为什么越来越慢的任何想法？

Answer 1

  

关于每个通话为什么越来越慢的任何想法？

您看到的时间是后端响应时间。后端变得越来越慢，对前端代码的任何更改都不会使其变得更快。

修复

修复后端

Answer 2

好吧，我已深入浅出，我将针对遇到同样问题的任何可怜的灵魂发布答案。

我读到内存泄漏和用于快照的Chrome工具。当然，每次点击页面时，我的内存使用量都随着时间的增加而增加。这意味着我的应用程序可用的内存更少，从而限制了我从API输入的数据。

原来我的一个插件引起了问题-https://github.com/inorganik/countUp.js-angular2。我使用的是版本6-更新到版本7后，无论我单击了多少页面，这都停止了内存泄漏并在大约3秒钟内每次执行API调用。

有用的文章；

https://auth0.com/blog/four-types-of-leaks-in-your-javascript-code-and-how-to-get-rid-of-them/ https://developers.google.com/web/tools/chrome-devtools/memory-problems/

Answer 3

这不是内存泄漏。您需要取消订阅

class A implements OnDestroy {
    protected ngUnsubscribe: Subject<void> = new Subject<void>();

    ngOnDestroy() {
        this.ngUnsubscribe.next();
        this.ngUnsubscribe.complete();
    }

并且在每次订阅时

  this.subscription.takeUntil( this.ngUnsubscribe ).subscribe( _ => _ );

这样，当您离开某个组件时，将运行ngOnDestroy并从内存中清除所有订阅。

PS。刚开始时，我遇到了同样的问题。我执行此操作后没问题，一切都像黄油一样运转顺利。