Question

我正在迅速从websocket nodejs后端获取数据，并且正在使用* ngFor在前端进行显示，一段时间后，我的应用程序开始滞后，并最终在一段时间后崩溃。寻找解决方案。

我正在查看异步是否可以帮助我使用* ngFor

显示更改的数据

rates.component.html

<ul>
    <li (click)="coin(coinz.type)" *ngFor="let coinz of btcCoins">
      <a href="javascript:void(0);">
        <span>
           {{coinz.symbol}}/ BTC
        </span>
        <span class="float-right">
            {{coinz.percent | number:'1.1-2'}}
            {{coinz.price}}
        </span>
      </a>
   </li>
</ul>

rates.component.ts

ngOnInit()
{
   this.socketService.getPrice().subscribe(data =>
   {
      this.btcCoins= data;
   });
}

socket.service.ts

bidask()
{
   let observable = new Observable(observer =>
   {
       this.socket = io(this.domain);
       this.socket.on('bidasks', (data) =>
       {
          observer.next(data);
       });
       return () =>
       {
          this.socket.disconnect();
       };
   });
   return observable;
}

Answer 1

当迭代大型且部分更改的集合时，请确保使用trackBy。

可以在https://netbasal.com/angular-2-improve-performance-with-trackby-cc147b5104e5上找到非常简单的教程

Answer 2

您可以尝试在Observable上使用delay（）运算符来减慢馈送到组件的数据速率-可能发生的情况是组件处于恒定的刷新状态，并最终不堪重负。 / p>

bidask()
{
   let observable = new Observable(observer =>
   {
       this.socket = io(this.domain);
       this.socket.on('bidasks', (data) =>
       {
          observer.next(data);
       });
       return () =>
       {
          this.socket.disconnect();
       };
   });
   return observable.delay(100);
}

其中return observable .delay（100）是更改，而 100 是ms延迟。

使用websockets快速获取数据时，Angular应用程序崩溃

2 个答案: