本書從幾個(gè)維度去介紹 React。一是作為 View 庫(kù)，它怎么實(shí)現(xiàn)組件化，以及它背后的實(shí)現(xiàn)原理。二是擴(kuò)展到 Flux 應(yīng)用架構(gòu)及重要的衍生品 Redux，它們?cè)趺磁c React 結(jié)合做應(yīng)用開發(fā)。三是對(duì) React 與 server 的碰撞產(chǎn)生的一些思考。四是講述它在可視化方面的優(yōu)勢(shì)與劣勢(shì)。
本書適合有一定經(jīng)驗(yàn)的前端開發(fā)人員閱讀。
全面深入講述React技術(shù)棧的第 1 本原創(chuàng)圖書，Strikingly聯(lián)合創(chuàng)始人及CTO郭達(dá)峰作序推薦，pure render專欄主創(chuàng)傾力打造
覆蓋React、Flux、Redux及可視化，幫助開發(fā)者在實(shí)踐中深入理解技術(shù)和源碼
前端組件化主流解決方案，一本書玩轉(zhuǎn)React“全家桶”
陳屹，前端架構(gòu)師，就職于阿里巴巴。熱衷開源事業(yè)，長(zhǎng)年專注于前端架構(gòu)、數(shù)據(jù)可視化、Node.js等領(lǐng)域，知乎專欄pure render的創(chuàng)辦人。
第1章 初入 React 世界 1
1．1 React 簡(jiǎn)介 1
1．1．1 專注視圖層 1
1．1．2 Virtual DOM 1
1．1．3 函數(shù)式編程 2
1．2 JSX 語(yǔ)法 3
1．2．1 JSX 的由來(lái) 3
1．2．2 JSX 基本語(yǔ)法 7
1．3 React 組件 11
1．3．1 組件的演變 11
1．3．2 React 組件的構(gòu)建 18
1．4 React 數(shù)據(jù)流 21
1．4．1 state 21
1．4．2 props 23
1．5 React 生命周期 29
1．5．1 掛載或卸載過程 29
1．5．2 數(shù)據(jù)更新過程 30
1．5．3 整體流程 33
1．6 React 與 DOM 34
1．6．1 ReactDOM 35
1．6．2 ReactDOM 的不穩(wěn)定方法 36
1．6．3 refs 38
1．6．4 React 之外的 DOM 操作 40
1．7 組件化實(shí)例：Tabs 組件 41
1．8 小結(jié) 47
第2章 漫淡 React 48
2．1 事件系統(tǒng) 48
2．1．1 合成事件的綁定方式 48
2．1．2 合成事件的實(shí)現(xiàn)機(jī)制 49
2．1．3 在React中使用原生事件 51
2．1．4 合成事件與原生事件混用 51
2．1．5 對(duì)比React合成事件與JavaScript原生事件 54
2．2 表單 55
2．2．1 應(yīng)用表單組件 55
2．2．2 受控組件 60
2．2．3 非受控組件 61
2．2．4 對(duì)比受控組件和非受控組件 62
2．2．5 表單組件的幾個(gè)重要屬性 63
2．3 樣式處理 64
2．3．1 基本樣式設(shè)置 64
2．3．2 CSS Modules 66
2．4 組件間通信 74
2．4．1 父組件向子組件通信 74
2．4．2 子組件向父組件通信 75
2．4．3 跨級(jí)組件通信 77
2．4．4 沒有嵌套關(guān)系的組件通信 79
2．5 組件間抽象 81
2．5．1 mixin 81
2．5．2 高階組件 86
2．5．3 組合式組件開發(fā)實(shí)踐 93
2．6 組件性能優(yōu)化 97
2．6．1 純函數(shù) 97
2．6．2 PureRender 100
2．6．3 Immutable 103
2．6．4 key 109
2．6．5 react-addons-perf 110
2．7 動(dòng)畫 111
2．7．1 CSS 動(dòng)畫與 JavaScript 動(dòng)畫 111
2．7．2 玩轉(zhuǎn) React Transition 113
2．7．3 緩動(dòng)函數(shù) 116
2．8 自動(dòng)化測(cè)試 121
2．8．1 Jest 121
2．8．2 Enzyme 124
2．8．3 自動(dòng)化測(cè)試 125
2．9 組件化實(shí)例：優(yōu)化 Tabs 組件 125
2．10 小結(jié) 133
第3章 解讀 React 源碼 134
3．1 初探 React 源碼 134
3．2 Virtual DOM 模型 137
3．2．1 創(chuàng)建 React 元素 138
3．2．2 初始化組件入口 140
3．2．3 文本組件 141
3．2．4 DOM 標(biāo)簽組件 144
3．2．5 自定義組件 150
3．3 生命周期的管理藝術(shù) 151
3．3．1 初探 React 生命周期 152
3．3．2 詳解 React 生命周期 152
3．3．3 無(wú)狀態(tài)組件 163
3．4 解密setState機(jī)制 164
3．4．1 setState異步更新 164
3．4．2 setState 循環(huán)調(diào)用風(fēng)險(xiǎn) 165
3．4．3 setState調(diào)用棧 166
3．4．4 初識(shí)事務(wù) 168
3．4．5 解密setState 170
3．5 diff 算法 172
3．5．1 傳統(tǒng) diff 算法 172
3．5．2 詳解 diff 172
3．6 React Patch 方法 181
3．7 小結(jié) 183
第4章 認(rèn)識(shí) Flux 架構(gòu)模式 184
4．1 React 獨(dú)立架構(gòu) 184
4．2 MV* 與 Flux 190
4．2．1 MVC/MVVM 190
4．2．2 Flux 的解決方案 193
4．3 Flux 基本概念 194
4．4 Flux 應(yīng)用實(shí)例 198
4．4．1 初始化目錄結(jié)構(gòu) 198
4．4．2 設(shè)計(jì) store 198
4．4．3 設(shè)計(jì) actionCreator 200
4．4．4 構(gòu)建 controller-view 202
4．4．5 重構(gòu) view 203
4．4．6 添加單元測(cè)試 205
4．5 解讀 Flux 206
4．5．1 Flux 核心思想 206
4．5．2 Flux 的不足 207
4．6 小結(jié) 207
第5章 深入 Redux 應(yīng)用架構(gòu) 208
5．1 Redux 簡(jiǎn)介 208
5．1．1 Redux 是什么 208
5．1．2 Redux 三大原則 209
5．1．3 Redux 核心 API 210
5．1．4 與 React 綁定 211
5．1．5 增強(qiáng) Flux 的功能 212
5．2 Redux middleware 212
5．2．1 middleware 的由來(lái) 212
5．2．2 理解 middleware 機(jī)制 213
5．3 Redux 異步流 217
5．3．1 使用 middleware 簡(jiǎn)化異步
請(qǐng)求 217
5．3．2 使用 middleware 處理復(fù)雜
異步流 221
5．4 Redux 與路由 224
5．4．1 React Router 225
5．4．2 React Router Redux 227
5．5 Redux 與組件 229
5．5．1 容器型組件 229
5．5．2 展示型組件 229
5．5．3 Redux 中的組件 230
5．6 Redux 應(yīng)用實(shí)例 231
5．6．1 初始化 Redux 項(xiàng)目 231
5．6．2 劃分目錄結(jié)構(gòu) 232
5．6．3 設(shè)計(jì)路由 234
5．6．4 讓應(yīng)用跑起來(lái) 235
5．6．5 優(yōu)化構(gòu)建腳本 239
5．6．6 添加布局文件 239
5．6．7 準(zhǔn)備首頁(yè)的數(shù)據(jù) 242
5．6．8 連接 Redux 245
5．6．9 引入 Redux Devtools 250
5．6．10 利用 middleware 實(shí)現(xiàn) Ajax
請(qǐng)求發(fā)送 251
5．6．11 請(qǐng)求本地的數(shù)據(jù) 252
5．6．12 頁(yè)面之間的跳轉(zhuǎn) 253
5．6．13 優(yōu)化與改進(jìn) 256
5．6．14 添加單元測(cè)試 257
5．7 小結(jié) 258
第6章 Redux 高階運(yùn)用 259
6．1 高階 reducer 259
6．1．1 reducer 的復(fù)用 259
6．1．2 reducer 的增強(qiáng) 261
6．2 Redux 與表單 262
6．2．1 使用 redux-form-utils 減少
創(chuàng)建表單的冗余代碼 263
6．2．2 使用 redux-form 完成表單的
異步驗(yàn)證 265
6．2．3 使用高階 reducer 為現(xiàn)有模塊
引入表單功能 267
6．3 Redux CRUD 實(shí)戰(zhàn) 268
6．3．1 準(zhǔn)備工作 268
6．3．2 使用 Table 組件完成“查”
功能 269
6．3．3 使用 Modal 組件完成“增”
與“改” 274
6．3．4 巧用 Modal 實(shí)現(xiàn)數(shù)據(jù)的刪除
確認(rèn) 277
6．3．5 善用 promise 玩轉(zhuǎn) Redux 異步事件流 278
6．4 Redux 性能優(yōu)化 279
6．4．1 Reselect 280
6．4．2 Immutable Redux 282
6．4．3 Reducer 性能優(yōu)化 282
6．5 解讀 Redux 284
6．5．1 參數(shù)歸一化 285
6．5．2 初始狀態(tài)及 getState 286
6．5．3 subscribe 286
6．5．4 dispatch 287
6．5．5 replaceReducer 288
6．6 解讀 react-redux 288
6．6．1 Provider 288
6．6．2 connect 290
6．6．3 代碼熱替換 293
6．7 小結(jié) 294
第7章 React 服務(wù)端渲染 295
7．1 React 與服務(wù)端模板 295
7．1．1 什么是服務(wù)端渲染 295
7．1．2 react-view 296
7．1．3 react-view 源碼解讀 296
7．2 React 服務(wù)端渲染 299
7．2．1 玩轉(zhuǎn) Node．js 300
7．2．2 React-Router 和 Koa-Router
統(tǒng)一 303
7．2．3 同構(gòu)數(shù)據(jù)處理的探討 306
7．3 小結(jié) 307
第8章 玩轉(zhuǎn) React 可視化 308
8．1 React 結(jié)合 Canvas 和 SVG 308
8．1．1 Canvas 與 SVG 308
8．1．2 在 React 中的 Canvas 310
8．1．3 React 中的 SVG 311
8．2 React 與可視化組件 316
8．2．1 包裝已有的可視化庫(kù) 316
8．2．2 使用 D3 繪制 UI 部分 317
8．2．3 使用 React 繪制 UI 部分 319
8．3 Recharts 組件化的原理 322
8．3．1 聲明式的標(biāo)簽 323
8．3．2 貼近原生的配置項(xiàng) 325
8．3．3 接口式的 API 326
8．4 小結(jié) 328
附錄A 開發(fā)環(huán)境 329
附錄B 編碼規(guī)范 345
附錄C Koa middleware 349
書單推薦
