“存储某种关于同步的信息以进行优化” 当您有很多相互依赖的实体时,这将成为一个非常困难的问题。
此外,构建客户端状态在大型应用程序中是一个难题。在 redux 社区中,被认为是最佳实践的经验法则是,在组件中插入和反规范化它们时,您需要在 redux 状态树中规范化和删除冗余。
relay 和 apollo 等库希望拥有他们管理的状态,以便他们可以在很大程度上免除最终用户对数据进行规范化/非规范化和管理缓存(尽可能多地)的责任,同时仍然提供他们在需要时进行低级控制。
这是一个相当复杂的问题,因为不同的组件可能依赖于部分模型,例如。 NoteSummary 组件可能只需要 title 和 tags 字段,NoteDetails 组件也需要 description 和 comments。
如果你自己管理 redux 状态,当出现NoteDetails 组件时,你将不得不为以下代码编写代码:
如果 Redux 树中还没有 Note,请使用 graphql 查询获取所需字段。
如果注释已存在,但并非所有必填字段都存在,请为缺少的字段创建一个 graphql 查询,然后通过查询 graphql 服务器获取它们。
如果注释已存在,并且包含所有必填字段,则只需使用本地版本。
当我们拥有相互依赖的实体,或者涉及实时协作或订阅时,这会变得更加复杂。
GraphQL 库试图以一种网络高效的方式解决上述所有问题。使用 react-apollo 或中继,您的组件可以声明它需要的所有内容和底层库,将智能地确定要获取的内容和数量。
这在哲学上类似于你编写 react 组件的方式:在你的渲染方法中,你声明你的最终组件层次结构应该是什么样子(给定当前状态),并且库 (react) 确定要对 DOM 进行哪些更改.
您应该评估您的用例是否受益于这种网络效率,如果是,您是否愿意投入时间来学习 GraphQL 及其周围的生态系统。
如果一个 redux 存储和几个 ajax 调用足以满足您的用例,那么它可以是一个更简单的设置。
如果您决定完全使用 GraphQL 和 Apollo,您可能根本不想使用 redux。您可以使用 apollo-link-state 并使用 graphql 查询和突变管理所有数据(本地或远程)。然后从您的组件的角度来看,某些数据是远程的还是本地的变得无关紧要。
如上所述,如果您真的想只将 redux 与 graphql 一起使用,而不需要像 Relay 这样的任何其他库,您可以直接使用 Apollo client。您可以从组件中分派thunks,然后在您的 thunk 中,您可以直接使用 Apollo 客户端进行 graphql 查询,一旦您收到响应,您可以使用另一个动作分派将该数据放入树中的树中。
如果这听起来更复杂,那是因为它就是这样。