27

反応時間の長いプロセスは、react+redux アプリのどこで「ライブ」する必要がありますか?

簡単な例として、websocket を介してメッセージを送受信するクラスを考えてみましょう。

class WebsocketStreamer {
  sendMessage(message) {
    this.socket.send(…);
  }

  onMessageReceive(event) {
    this.dispatch({
        type: "STREAMER_RECV",
        message: event.data,
    })
  }
}

このクラスのライフサイクルはどのように管理する必要がありますか?

私の最初の本能は、それを維持することstoreです:

var stores = {
  streamer: function(state={}, action) {
    if (action.type == "@@INIT")
      return { streamer: new WebsocketStreamer() }
    if (action.type == "STREAMER_SEND")
      state.streamer.sendMessage(action.message)
    return state;
  }
}

しかし、少し奇妙であることは別として、が関数にWebsocketStreamerアクセスする方法がなくdispatch()、ホット リロードが中断されます。

別の潜在的な解決策は、それをどこかのグローバルに保持することです。

const streamer = new WebsocketStreamer();

しかし、これには明らかなテスト容易性への影響があり、ホット リロードも中断します。

では、長時間実行されるプロセスは、react + redux アプリのどこに置くべきでしょうか?

注: この単純な例は、ストアとアクション プロバイダーだけで構築できることがわかりました。しかし、長寿命のプロセスが存在する状況で、そのプロセスがどこに存在するべきかを具体的に知りたいです。

4

3 に答える 3