2017-08-22 7 views
2

ngrxの賛同者(here for example)は、すべてのアプリケーションの状態を1つのStoreに保存することができます。これは、キャッシュの内容がアプリケーション状態の一種であるため、@ ngrx/Storeがキャッシュに使用できることを示唆しています。@ ngrx/Storeはどのようにしてキャッシュに使用できますか?

ウェブアプリケーションのキャッシュは、データを持っているときにデータを返し、そうでないときはデータの要求をカプセル化します。 Wikipedia article on cachingは、データが使用可能なときにはキャッシュヒットと呼び、そうでないときはキャッシュミスと呼びます。

機能プログラミングの観点からは、キャッシュからデータを読み取ることが機能的に不完全であることがすぐにわかります。これは、データがサーバーから要求され、キャッシュに保持されるという副作用があります。私は、例えばSelectorが機能的に純粋であることを必要とするngrxを使ってこれを行う方法を知らない。

このCaching With RxJs Observables in Angularチュートリアル(rxjsはngrxと非常に相補的であると言われています)を検討すると役に立ちます。私たちは、副作用との完全なgetFriends()機能を見つけるために、これまでスクロールする必要はありません。

getFriends() { 

    if(!this._friends){ 

    this._friends = this._http.get('./components/rxjs-caching/friends.json') 
         .map((res:Response) => res.json().friends) 
         .publishReplay(1) 
         .refCount(); 
    } 

    return this._friends; 
} 

はまた、ストアの内容は、アプリケーション全体に普遍的に利用可能であるように見えます。唯一のコントロールは状態の更新方法ですが、使用可能なキャッシュ項目と使用できないキャッシュ項目が保証されていないため、キャッシュの未加工データの中を突っ走るのは愚かです。

うまくいけば、これらの懸念を払拭し、これをやり遂げる方法があります。 @ ngrx/Storeをキャッシュとして使う良い方法を教えてください。

答えて

1

ngrxには、必要に応じて状態(またはキャッシュ)を変更する縮小機能(純粋な機能)があります。これらのレデューサーは、あなたが店舗に派遣する行為によってトリガーされます。

セレクタによってデータのスライスを要求し、その変更をサブスクライブします。

キャッシュロジックを実装するには、データが利用可能かどうかをチェックし、そうでない場合は、が "LoadDataSliceAction"のようなアクションを送出し、サイドエフェクトをトリガしてストアにデータをロードします。

これは役に立ちますか?

+0

ありがとうございました。正直なところ、私は動作するサンプルを実行するのに苦労しています。また、キャッシュが隠すべきもの(キャッシュロジックとキャッシュの内容によって送出されるアクション)が公開されているように見えます。しかし、[ngrxを使う利点(https://gist.github.com/btroncone/a6e4347326749f938510#advantages-of-store)(特に[Time Travel](https://www.youtube.com/) watch?v = 70oPxMA7Ig))おそらく私たちはひどくキャッシュすることで生きることができますか? – Antony

関連する問題