4

リレー キャッシュを Flux ストアに組み込んで、「タイム トラベル」を実行し、アプリケーションを深く理解できるようにしたいと考えています。

リレー ストアとアクションのように見えますが、すべてシリアル化できないクラスであり、残念です。しかし、ネットワーク リクエストからキャッシュを分離し、キャッシュを Flux ストアに保存できるようにする必要があるようです。

それは面白そうですか、それとも間違ったツリーを吠えていますか?

4

1 に答える 1

4

Relay は確かに Flux と一緒に使用できます。私たちは、これらを一緒に使用して成功している多くの開発者と話をしました。一般的なパターンは、Relay がサーバー データのキャッシュを所有し、サーバーとの通信を管理し、Flux を使用してクライアントのみのデータを保存および更新することです。

フラックスからのリレー データの読み取り

Flux ストアがサーバー データにアクセスする必要がある場合、Relay.StoreAPI を使用してサーバーからデータを取得し、キャッシュから読み取ることができます。

// build a query 
var query = Relay.createQuery(Relay.QL`query { ... }`, {var: 'value'});
// fetch any missing data for this query
Relay.Store.primeCache({query}, readyState => {
  if (readyState.done) {
    // read data once the cache is populated
    var data = Relay.Store.readQuery(query)[0];
  }
});

リレー キャッシュの検査

Relay は、タイムトラベルのデバッグを直接サポートしていません。ただし、Relay 用の開発者ツールの開発に積極的に取り組んでおり、これの初期バージョンはまもなく利用可能になるはずです。それまでの間、キャッシュの状態を検査するためのいくつかのオプションがあります。

  • すべての低レベルの更新を傍受して、Relay ストアに記録します。RelayStoreData.getDefaultInstance().injectCacheManager(...)これは、キャッシュ マネージャーに(API 名は変更される可能性がありますが、キャッシュ マネージャー API 自体は安定していることに注意してください) を注入することで実行できます。CacheManager インターフェイスはここで定義されています。これにより、Relay のキャッシュに書き込まれたすべての値を記録して、データの任意の視覚化を構築できることに注意してください。キャッシュ マネージャーに書き込まれるすべてのフィールド値は、JSON シリアル化可能です。キャッシュ マネージャーはデータをストアに書き戻すことができないことに注意してください。これにより、主にキャッシュの現在の状態を可視化できます。
  • カスタム ネットワーク レイヤーを挿入することにより、ネットワーク レイヤーですべてのクエリおよびミューテーション リクエストをインターセプトします。これにより、アプリケーションが要求しているデータと、サーバーから何を受け取っているかがわかります。
于 2015-12-28T01:07:55.073 に答える