GraphQL 如何取代 Redux
简评:使用 GraphQL 可以大大简化客户端状态管理部分的代码。
⚛️切换到React
故事背景:在 2016 年,Pathwright 的前端团队就开始将客户端的代码从 Backbone & Marionette 切换到 React。 对于我们来说 UI 的声明性模型比 MVC 模型更具意义。
我们使用 flux 架构来管理随着应用状态,随着业务变得复杂,它添加了越来越多间接层。当我们着手处理 store 或者状态树中的一个分支逻辑的时候,实际上是将服务端业务数据和关系复制到客户端上。
我们拥有优雅的声明式 React 组件,但是数据层确是 action、reducers、异步中间件和去赋范的数据逻辑。
这一切都感觉非常的错误。
↪️切换到GraphQL
当我们尝试 GraphQL 的时候马上就爱上了它。我们将 GraphQL 替换了一堆 REST API。当我们 UI 使用这些新的 GraphQL 时不再需要 store。我们通常需要创建一个 stores,action 等待,但是最终我们将这部分内容删除了,因为实在没有必要。
GraphQL 如何取代 Redux的更多相关文章
- Redux和Context对比
Redux和Context对比 如果项目体量较小,只是需要一个公共的store存储state,而不讲究使用action来管理state,那context完全可以胜任.反之,则是redux的优点. co ...
- React 16.3来了:带着全新的Context API
文章概览 React在版本16.3-alpha里引入了新的Context API,社区一片期待之声.我们先通过简单的例子,看下新的Context API长啥样,然后再简单探讨下新的API的意义. 文中 ...
- 探索 Redux4.0 版本迭代 论基础谈展望(对比 React context)
Redux 在几天前(2018.04.18)发布了新版本,6 commits 被合入 master.从诞生起,到如今 4.0 版本,Redux 保持了使用层面的平滑过渡.同时前不久, React 也从 ...
- React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路
React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路 这几天在忙着把自己做的项目中的类组件转化为功能相同的函数组件,首先先贴一份该组件类组件的关 ...
- 6周学习计划,攻克JavaScript难关(React/Redux/ES6 etc.)
作者:余博伦链接:https://zhuanlan.zhihu.com/p/23412169来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 和大家一样,最近我也看了Jo ...
- 还在纠结 Flux 或 Relay,或许 Redux 更适合你
重磅消息,Redux 1.0 发布,终于可以放心用于生产环境了! 在这个端应用技术膨胀的时代,每天都有一大堆框架冒出,号称解决了 XYZ 等一系列牛 X 的问题,然后过一段时间就不被提起了.但开发的应 ...
- React-Native 之 redux 与 react-redux
前言 本文 有配套视频,可以酌情观看. 文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我讨论. 文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关,如文中内 ...
- 新技术探究之 GraphQL
What? GraphQL 是一种类似于 SQL 的结构化查询语言,由 facebook 于2012年创造,于2015年开源.SQL 在服务端定义,GraphQL 在客户端定义,也就是说 GraphQ ...
- [React] react+redux+router+webpack+antd环境搭建一版
好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...
随机推荐
- Window Application has "update" key words
Error Qt Creater:console error:Failed to start program. Path or permissions wrong? Description 在使用Qt ...
- mybatis整合spring的完整过程
1.1 整合思路 1.SqlSessionFactory对象应该放到spring容器中作为单例存在. 2.传统dao的开发方式中,应该从spring容器中获得sqlsession对象. 3.Mappe ...
- JetBrains全家桶激活地址
全家桶地址:https://www.jetbrains.com/products.html?fromMenu JetBrains 授权服务器(License Server URL):http://id ...
- JavaScript RegExp.exec() 方法
定义和用法: exec() 方法用于检索字符串中的正则表达式的匹配. 语法: RegExpObject.exec(string); RegExpObject:必须参数,正则表达式: string:必须 ...
- [Selenium] 在Grid模式下打印出当前Case是在哪台Node上运行
AAAbstractFlow() public void getComputerNameOfNode(WebDriver driver){ String CIHub = Environment.get ...
- facebook对xtrabackup的优化整理
1)Adding xtrabackup files https://github.com/facebook/mysql-5.6/commit/6eb74f86e27410f1ad7bf3379ce15 ...
- android Service 的简单使用(转)
1.要使用Service,首先就是在配置文件里吗添加Service,如果不填加,你的Service是不能够使用的.目前学到的方法有两种 方法一:<service android:enabl ...
- 14 Finding a Shared Motif
Problem A common substring of a collection of strings is a substring of every member of the collecti ...
- jquery怎么根据后台传过来的值动态设置下拉框、单选框选中
$(function(){ var sex=$("#sex").val(); var marriageStatus=$("#marriageStatus").v ...
- 阿里云服务器ECS按ctrl+alt+delete无法登录
今天在使用阿里云服务器远程桌面的时候发现怎么也进入不了,远程桌面无法连接,于是想到了在阿里云服务器管理控制台可以使用连接管理终端进行远程桌面连接,下面详细介绍阿里云服务器操作经验. 操作步骤如下 登录 ...
Redux和Context对比 如果项目体量较小,只是需要一个公共的store存储state,而不讲究使用action来管理state,那context完全可以胜任.反之,则是redux的优点. co ...
文章概览 React在版本16.3-alpha里引入了新的Context API,社区一片期待之声.我们先通过简单的例子,看下新的Context API长啥样,然后再简单探讨下新的API的意义. 文中 ...
Redux 在几天前(2018.04.18)发布了新版本,6 commits 被合入 master.从诞生起,到如今 4.0 版本,Redux 保持了使用层面的平滑过渡.同时前不久, React 也从 ...
React 函数组件中对window添加事件监听resize导致回调不能获得Hooks最新状态的问题解决思路 这几天在忙着把自己做的项目中的类组件转化为功能相同的函数组件,首先先贴一份该组件类组件的关 ...
作者:余博伦链接:https://zhuanlan.zhihu.com/p/23412169来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 和大家一样,最近我也看了Jo ...
重磅消息,Redux 1.0 发布,终于可以放心用于生产环境了! 在这个端应用技术膨胀的时代,每天都有一大堆框架冒出,号称解决了 XYZ 等一系列牛 X 的问题,然后过一段时间就不被提起了.但开发的应 ...
前言 本文 有配套视频,可以酌情观看. 文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我讨论. 文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关,如文中内 ...
What? GraphQL 是一种类似于 SQL 的结构化查询语言,由 facebook 于2012年创造,于2015年开源.SQL 在服务端定义,GraphQL 在客户端定义,也就是说 GraphQ ...
好久之前搭建的一个react执行环境,受历史影响是webpack3.10.0和webpack-dev-server2.7.1的环境,新项目准备用webpack4重新弄弄了,旧的记录就合并发布了(在没有 ...
Error Qt Creater:console error:Failed to start program. Path or permissions wrong? Description 在使用Qt ...
1.1 整合思路 1.SqlSessionFactory对象应该放到spring容器中作为单例存在. 2.传统dao的开发方式中,应该从spring容器中获得sqlsession对象. 3.Mappe ...
全家桶地址:https://www.jetbrains.com/products.html?fromMenu JetBrains 授权服务器(License Server URL):http://id ...
定义和用法: exec() 方法用于检索字符串中的正则表达式的匹配. 语法: RegExpObject.exec(string); RegExpObject:必须参数,正则表达式: string:必须 ...
AAAbstractFlow() public void getComputerNameOfNode(WebDriver driver){ String CIHub = Environment.get ...
1)Adding xtrabackup files https://github.com/facebook/mysql-5.6/commit/6eb74f86e27410f1ad7bf3379ce15 ...
1.要使用Service,首先就是在配置文件里吗添加Service,如果不填加,你的Service是不能够使用的.目前学到的方法有两种 方法一:<service android:enabl ...
Problem A common substring of a collection of strings is a substring of every member of the collecti ...
$(function(){ var sex=$("#sex").val(); var marriageStatus=$("#marriageStatus").v ...
今天在使用阿里云服务器远程桌面的时候发现怎么也进入不了,远程桌面无法连接,于是想到了在阿里云服务器管理控制台可以使用连接管理终端进行远程桌面连接,下面详细介绍阿里云服务器操作经验. 操作步骤如下 登录 ...