タグ付けされた質問 「rxjs」

先週、私はRxJSに答えました 質問「特定の副作用ごとにサブスクリプションを作成するべきか、それともサブスクリプションを最小限に抑えるべきか」について、別のコミュニティメンバーと話し合いました。完全なリアクティブアプリケーションアプローチの観点からどの方法を使用するか、またはいつ切り替えるかを知りたい。これは私とおそらく他の人たちが不必要な議論を避けるのに役立ちます。 セットアップ情報 すべての例はTypeScriptにあります サブスクリプションのライフサイクル/コンストラクターの使用に関する質問に焦点を当てず、フレームワークを無関係に保つ 想像してみてください：サブスクリプションはコンストラクター/ライフサイクルの初期化で追加されます 想像してみてください：登録解除はライフサイクル破棄で行われます 副作用とは（角度サンプル） UIでの更新/入力（例 value$ | async） コンポーネントの出力/アップストリーム（例@Output event = event$） 異なる階層の異なるサービス間の相互作用 使用例： 2つの機能： foo: () => void; bar: (arg: any) => void 2つのソースオブザーバブル： http$: Observable<any>; click$: Observable<void> fooがhttp$発行された後に呼び出され、値は必要ありません barclick$エミット後に呼び出されますが、現在の値が必要ですhttp$ ケース：特定の副作用ごとにサブスクリプションを作成する const foo$ = http$.pipe( mapTo(void 0) ); const bar$ = http$.pipe( switchMap(httpValue => click$.pipe( …

10 javascript  angular  typescript  rxjs  reactive-programming 

100ms間隔でコメントを「遅延読み込み」するコンポーネントがあります。 setTimeoutを使用すると、実際に遅延します。 成分 <div *ngFor="let post of posts"> <app-post [post]="post" ></app-post> </div> これにより、アプリケーションが遅くなります（平均fps 14、アイドル時間51100ms）： while(this.postService.hasPosts()){ setTimeout(()=> { this.posts.push(this.postService.next(10)); },100); } これにより、アプリケーションがスムーズになります（平均fps 35、アイドル時間40800ms） while(this.postService.hasPosts()){ timer(100).subscribe(()=> { this.posts.push(this.postService.next(10)); }); } 説明はありますか、なぜrxjsタイマーがはるかにうまく機能するのですか？ 私はFirefoxでランタイム分析を行いました。最初の例では、フレームレートは14 fpsに下がります。他の例では、35 fpsになります。 アイドル時間も20％短くなります。 この方法はさらにスムーズです（平均fps 45、アイドル時間13500ms）： interval(100).pipe(takeWhile(this.postService.hasPosts()).subscribe(()=> { this.posts.push(this.postService.next(10)); }); }

9 javascript  angular  typescript  rxjs