Redux

  • 更新:我们基于此最佳实践做了一个封装方案:dva,可以简化使用 redux 和 redux-saga 时很多繁杂的操作。

    前端变化虽快,但其实一直都围绕这几个概念在转:

    • URL - 访问什么页面
    • Data - 显示什么信息
    • View - 页面长成什么样
    • Action - 对页面做了什么操作
    • API Server - Data 数据的来源

    在 redux 的生态圈内,每个环节有多种方案,比如 Data 可以是 immutable 或者 plain object,在你选了 immutable 之后,用 immutable.js 还是 seamless-immutable,以及是否用 re

  • 对 Roof 不感兴趣的同学可以直接从 Redux 段落读起。

    下文说说我理解的支付宝前端应用架构发展史,从 roof 到 redux,再到 dva。

    Roof 应该是从 0.4 开始在项目里大范围推广的。

    Roof 0.4

    Roof 0.4 接触不多,时间久了已经没有太多印象了,记忆中很多概念是从 baobab 里来的,通过 cursor 订阅数据,并基于此设计了很多针对复杂场景的解决方案。

    这种方式灵活且强大,现在想想如果这条路一走到底,或许比现在要好一些。但由于概念比较多,当时大家都比较难理解 cursor 这类的概念。并且 redux 越来越流行。。

    Roof 0.5

    然后有了 R

  • Redux 异步

    随着场景的复杂化,在异步结果得到之后再进行 dispatch 变得越来越不可取与不可维护。Redux 自身并没打算解决这个问题,但由于提供了 middleware,可以在这层上做文章。

    比较熟知的 Redux 异步 middleware 有 redux-thunk, redux-promise, redux-saga 等。

    关于这些 middlware 如何使用,可以参考我近期校对过的文章 Redux 异步四兄弟,如果怀疑文章翻译的准确度,可以直接看原文 Redux 4 ways。

    标准化的 action

    Redux 自身没有要求 action 应该是什么格式,但按照一些实

  • Redux 学习总结

    1. 写在前面

    对于复杂的 Web 交互应用,相继出现了一系列的 MV* 框架,09 年的 Angular 带动了一系列的发展。

    在后期的开发过程中,大家发现 Angular 太过于重,双向绑定的数据流容易让数据变得不可控制。

    在任何应用中管理数据都是必不可少的。通过用户界面来编排数据流是一项具有挑战的工程。现代的 Web 应用会涉及复杂的 UI 交互,比如改变了一个地方的 UI 数据,需要直接或者间接的改变其他地方的 UI 数据。一些双向绑定的框架(比如:Angular.js 等)都是对这种场景比较好的解决方案。

    对于一些应用(尤其是数据流比较简单的),这种双向绑定

  • 1. 前言

    很久很久之前,写过一篇介绍 Redux 相关概念的文章 听说你需要这样了解 Redux(一),随后因为实习的事情拖延了后续(根本原因是懒)。

    在实习中也更加深刻的认识了 Redux 相关的内容。除此之外,翻译 Redux 中文文档 redux-in-chinese 也让我静心下来仔细品读了设计理念。

    这篇文章中我将介绍一个如何把 React 和 Redux 这两个大杀器结合起来,同时也会介绍一些 state、reducer 设计相关的东西。

    2. 正文

    2.1 连接神器 react-redux

    react 和 redux 可以说是没有任何关系,redux 主要提供一个全局的 sto