web-dev-qa-db-ja.com

GraphQLおよびReact-Nativeを使用したRelay vs Redux vs Apollo

新しい(Web +ネイティブ)プロジェクト(ミッドサイズアプリ)をゼロから開始する必要があります。特にここ数年、多くのJSフレームワークと実装があるため、私の通常のスタックには2番目の疑問がありました。

NodeおよびバックエンドのMongoDBとともにREST APIを使用して、フロントエンドでreact + reduxを使用しています。

この新しいプロジェクトでは、React-Native + React Native for Web + Node + PostgreSQL。データの取得と状態/ストアの管理に使用する必要があります。

これまでのところ、reduxはうまく機能しました。ただし、JSの進化の性質によります。私は過去に使っていたのと同じスタックを使うことに少し懐疑的です。

次のスタックに行く場合の長所と短所は何ですか

React-Native + React-Native-For-Web + Redux + GraphQL + Node + PostgreSQL


React-Native + React-Native-For-Web + Relay + GraphQL + Node + PostgreSQL


React-Native + React-Native-For-Web + Apollo + GraphQL + Node + PostgreSQL

私は各フレームワークを使用する利点を述べた多くの記事を読みましたが、コンテンツと記事の量は少し怖いです。正しい答えも間違った答えもないことを理解しています。ただし、学習曲線が少なく、ドキュメントが優れていて、保守性が高く、回避策が少ないことを念頭に置いて、前述のスタックがうまく組み合わされていることを知っておくといいでしょう。

25
zaq

もしあなたがReact + Reduxのバックグラウンドから来ているなら、Apolloはあなたのために行くべき道だと思います!

注:GraphQLを初めて使用する場合は、RelayとApolloの両方のチュートリアルを見つけることができる How to GraphQL を確認することをお勧めします。

いくつかの情報:

  • リレーは非常に強力ですが、非常に複雑であり、顕著な学習曲線を備えています。
  • ApolloはReduxの上に構築されますが、ストアはあなたから隠されているため、開発者としてはあまり関係ありません。ただし、Reduxと同様の概念が使用されています。 updateQueries でストアを更新するため。
  • Apolloストアを独自のReduxストアと組み合わせて サーバーからキャッシュされたデータ以外の状態を管理したい場合にも簡単です
  • Apolloでは、 リアルタイムサブスクリプション も使用できます。
  • ApolloやRelayを使用せず、Reduxのみを使用することは絶対にお勧めしません。どちらのフレームワークも、クエリ、ミューテーション、キャッシュ、UIの更新を送信する際に、かなりの労力を要するからです。ただし、より軽量なGraphQLクライアントを探している場合は、 Lokka をご覧ください。

これを見てください 詳細な記事 詳細な背景情報については、リレーとアポロを比較してください。

RelayとApolloの詳細については、 How to GraphQL チュートリアルWebサイトをご覧ください。

ところで、自分でビルドしたくない場合のバックエンドの別のオプションは Graphcool (免責事項:私は彼らのために働いています:))。

31
nburk