4

データ用の API を使用するリアルタイム ダッシュボードを作成しています。アプリケーションは、ノード API の上に構築された同形反応アプリです。私は Flux アーキテクチャ、より具体的にはalt 実装を使用しています。

私の質問は、ダッシュボードには約 4/5 のリアルタイム チャートがあり (私はReact D3 ライブラリを使用しています)、各チャートは API エンドポイントを呼び出します。メイン<Dashboard />コンポーネントがあり、この内部に各チャート コンポーネントが存在します。私の質問は<Dashboard />、データをリッスンして小道具として渡すことを担当する必要がありますか、それとも各グラフコンポーネントが独自のストア/アクションライフサイクルを担当する必要がありますか? データを props として渡すと、UI が必要以上に再レンダリングされることになりますか?

React/Dashboard/Charting アプリケーションの例をまだ見つけていないので、誰かがこれを知っていれば非常に便利です。

4

1 に答える 1

1

API アクセスを最上位に保持し、すべてを props 経由で渡すことをお勧めします。API からのデータをストアに入れ、それを使用して最上位コンポーネントを駆動することを検討してください。そのようにすることの実際的な利点：

  • 同じデータを複数の場所で自由に使用できるようになりました-子コンポーネントに閉じ込められません
  • ダミーの props を渡すだけで正しい結果が得られることを確認できるため、テストが簡素化されます。
  • 推論するのは簡単です: 子コンポーネントは、データがどこから来たのかの実装の詳細を気にする必要がなくなりました

パフォーマンスに関する質問について:純粋なレンダー ミックスインを使用し、ストアの変更が必要な部分のみを更新することを検討してください。そうすれば、チャート コンポーネントは何かが変更されたことを非常に迅速に認識でき、何も変更されていない場合は再レンダリングされません。

于 2015-07-08T12:16:40.390 に答える