《Vue.js技術內幕》是2022年人民郵電出版社出版的圖書，作者是黃軼。
基本介紹
- 中文名：Vue.js技術內幕
- 作者：黃軼
- 出版時間：2022年9月
- 出版社：人民郵電出版社
- ISBN：9787115596468
- 類別：圖書>計算機/網路>程式設計>其他
- 開本：128 開
- 裝幀：平裝-膠訂
- 叢書名：圖靈原創
內容簡介,圖書目錄,作者簡介,
內容簡介
本書將帶領讀者閱讀Vue.js 3.0 的源碼，通過大量注釋、流程圖，呈現每部分源碼的“前因後果”，幫助讀者體會Vue.js 的設計思想。全書共七部分，分為24 章，作者結合實際用例，循序漸進地介紹了Vue.js的整體設計、組件、回響式原理、編譯和最佳化、實用特性、內置組件、官方生態等內容。閱讀本書不僅可以深入理解Vue.js 的核心實現，還能學到閱讀源碼的技巧，提高業務邏輯分析能力和代碼重構能力。
本書面向有 Vue.js、React 或者 Angular 等框架的使用經驗，對源碼設計感興趣，渴望在技術方面進一步成長的開發者。
圖書目錄
第 一部分 Vue.js 的整體設計
第 1章 Vue.js 3.x 的最佳化 2
1.1 源碼最佳化 2
1.1.1 monorepo 2
1.1.2 TypeScript 3
1.2 性能最佳化 4
1.2.1 源碼體積最佳化 4
1.2.2 數據劫持最佳化 5
1.2.3 編譯最佳化 7
1.3 語法API 最佳化 9
1.3.1 最佳化邏輯組織 9
1.3.2 最佳化邏輯復用 12
1.4 引入RFC 14
1.5 總結 14
第 2章 Vue.js 3.x 源碼總覽 15
2.1 源碼目錄結構 15
2.2 不同構建版本Vue.js 的使用場景 18
2.2.1 Runtime-only 與 Runtime Compiler 19
2.2.2 CDN 直接使用 19
2.2.3 配合打包工具使用 20
2.2.4 服務端渲染使用 20
2.3 編譯構建 21
2.3.1 收集編譯目標 21
2.3.2 並行編譯 21
2.3.3 單個編譯 22
2.4 rollup 配置 23
2.4.1 輸入與輸出 24
2.4.2 external 27
2.4.3 外掛程式配置 28
2.5 總結 31
第二部分 組件
第3章 組件的渲染 34
3.1 什麼是vnode 35
3.1.1 普通元素vnode 35
3.1.2 組件vnode 35
3.1.3 vnode 的優勢 36
3.2 如何創建vnode 37
3.3 組件的掛載 41
3.3.1 設定副作用渲染函式 42
3.3.2 渲染組件生成subTree 43
3.3.3 subTree 的掛載 45
3.3.4 普通元素的掛載 46
3.3.5 組件的嵌套掛載 49
3.4 應用程式初始化 50
3.4.1 創建app 對象 50
3.4.2 重寫app.mount 函式 52
3.4.3 執行mount 函式渲染套用 53
3.5 總結 54
第4章 組件的更新 55
4.1 渲染函式更新組件的過程 55
4.2 patch 流程 56
4.2.1 處理組件 58
4.2.2 處理普通元素 61
4.3 核心diff 算法 65
4.3.1 同步頭部節點 66
4.3.2 同步尾部節點 67
4.3.3 添加新的節點 68
4.3.4 刪除多餘節點 69
4.3.5 處理未知子序列 71
4.3.6 移動子節點 73
4.3.7 建立索引圖 74
4.3.8 更新和移除舊節點 75
4.3.9 移動和掛載新節點 78
4.3.10 長遞增子序列 80
4.4 總結 85
第5章 組件的實例 87
5.1 創建組件實例 87
5.2 設定組件實例 90
5.2.1 創建渲染上下文代理 92
5.2.2 上下文代理的最佳化 96
5.2.3 處理setup 函式 98
5.2.4 完成組件實例設定 103
5.2.5 兼容Options API 105
5.3 總結 107
第6章 組件的props 108
6.1 props 配置的標準化 109
6.2 props 值的初始化 112
6.2.1 設定props 113
6.2.2 驗證props 117
6.2.3 回響式處理 119
6.3 props 的更新 120
6.3.1 觸發子組件重新渲染 121
6.3.2 更新instance.props 121
6.3.3 把instance.props 變成回響式的 124
6.3.4 對象類型props 數據的更新 125
6.4 總結 128
第7章 組件的生命周期 129
7.1 註冊鉤子函式 130
7.2 onBeforeMount 和onMounted 132
7.3 onBeforeUpdate 和onUpdated 134
7.4 onBeforeUnmount 和onUnmounted 136
7.5 onErrorCaptured 137
7.6 總結 139
第8章 異步組件 140
8.1 defineAsyncComponent 141
8.1.1 渲染占位節點 143
8.1.2 載入異步JavaScript 模組 144
8.1.3 重新渲染組件 145
8.2 高級用法 145
8.2.1 Loading 組件 146
8.2.2 Error 組件 147
8.3 只載入一次 150
8.4 總結 152
第三部分 回響式原理
第9章 回響式的內部實現原理 154
9.1 回響式對象的實現差異 155
9.2 reactive API 157
9.3 依賴收集 160
9.4 派發通知 164
9.4.1 副作用函式 166
9.4.2 嵌套effect 的場景 168
9.4.3 cleanup 的設計 169
9.5 回響式實現的最佳化 171
9.5.1 依賴收集的最佳化 171
9.5.2 trackOpBit 的設計 176
9.6 ref API 177
9.6.1 ref API 的最佳化 178
9.6.2 unref 180
9.7 shallowReactive API 182
9.8 readonly API 183
9.9 總結 185
第 10章 計算屬性 186
10.1 computed API 186
10.2 計算屬性的運行機制 190
10.3 嵌套計算屬性 193
10.4 總結 193
第 11章 偵聽器 195
11.1 watch API 的用法 196
11.2 watch API 的實現原理 196
11.2.1 標準化source 197
11.2.2 創建job 200
11.2.3 創建scheduler 201
11.2.4 創建effect 202
11.2.5 返回銷毀函式 203
11.3 異步任務佇列的設計 204
11.3.1 異步任務佇列的創建 205
11.3.2 異步任務佇列的執行 208
11.3.3 檢測循環更新 211
11.4 watchEffect API 212
11.5 註冊無效回調函式 215
11.6 偵聽器調試 216
11.7 總結 219
第四部分 編譯和最佳化
第 12章 模板解析 222
12.1 生成AST 223
12.2 創建解析上下文 226
12.3 解析子節點 227
12.3.1 生成AST 節點數組 228
12.3.2 注釋節點的解析 230
12.3.3 插值的解析 232
12.3.4 普通文本的解析 233
12.3.5 元素節點的解析 234
12.3.6 空白字元處理 238
12.4 創建AST 根節點 240
12.5 總結 240
第 13章 AST 轉換 242
13.1 創建transform 上下文 244
13.2 遍歷AST 節點 246
13.2.1 Element 節點轉換函式 247
13.2.2 表達式節點轉換函式 252
13.2.3 Text 節點轉換函式 254
13.2.4 條件節點轉換函式 258
13.3 靜態提升 266
13.4 創建根節點的代碼生成節點 270
13.5 總結 272
第 14章 生成代碼 273
14.1 創建代碼生成上下文 276
14.2 生成預設代碼 278
14.3 生成渲染函式的名稱和參數 282
14.4 生成資源聲明代碼 283
14.5 生成創建vnode 樹的表達式 285
14.6 運行時最佳化 298
14.7 總結 302
第五部分 實用特性
第 15章 依賴注入 304
15.1 provide API 305
15.2 inject API 307
15.3 對比模組化共享數據的方式 308
15.4 依賴注入的缺陷和套用場景 309
15.5 總結 313
第 16章 插槽 314
16.1 插槽的用法 314
16.2 插槽的實現 317
16.2.1 父組件的渲染 317
16.2.2 子組件的渲染 320
16.2.3 作用域插槽 325
16.3 總結 327
第 17章 自定義指令 328
17.1 指令的定義 329
17.2 指令的註冊 330
17.3 指令的套用 331
17.4 總結 337
第 18章 v-model 指令 338
18.1 普通表單元素 338
18.2 自定義組件 342
18.3 自定義事件派發 345
18.4 v-model 修飾符 346
18.4.1 默認修飾符 347
18.4.2 帶參數的修飾符 348
18.5 總結 350
第六部分 內置組件
第 19章 Teleport 組件 352
19.1 Teleport 實現原理 354
19.1.1 組件創建 355
19.1.2 組件更新 357
19.1.3 組件移除 359
19.2 總結 360
第 20章 KeepAlive 組件 362
20.1 組件的渲染 364
20.2 快取的設計 366
20.3 props 設計 369
20.4 組件的卸載 370
20.5 總結 372
第 21章 Transition 組件 373
21.1 Transition 組件的用法 373
21.2 組件的核心思想 376
21.3 組件的實現原理 377
21.3.1 組件的渲染 380
21.3.2 鉤子函式的執行 381
21.3.3 模式的套用 389
21.4 總結 391
第 22章 TransitionGroup 組件 392
22.1 組件的實現原理 392
22.1.1 組件的渲染 395
22.1.2 move 過渡實現 396
22.2 總結 399
第七部分 官方生態
第 23章 Vue Router 402
23.1 路由的基本用法 402
23.2 路由的實現原理 404
23.2.1 路由對象的創建 404
23.2.2 路由的安裝 404
23.2.3 路徑的管理 406
23.2.4 路徑和路由組件的渲染的映射 413
23.2.5 守衛函式的實現 422
23.2.6 完整的導航解析流程 426
23.3 總結 435
第 24章 Vuex 436
24.1 Vuex 是什麼 436
24.1.1 什麼是“狀態管理模式” 436
24.1.2 Vuex 核心思想 438
24.2 Vuex 初始化 438
24.2.1 創建store 實例 439
24.2.2 初始化模組 440
24.2.3 安裝模組 445
24.2.4 重置state 453
24.2.5 Vuex 安裝 456
24.3 API 457
24.3.1 數據獲取 457
24.3.2 數據存儲 459
24.3.3 語法糖 463
24.3.4 動態更新模組 469
24.4 外掛程式 470
24.5 總結 474
作者簡介
黃軼，曾任職於百度、滴滴，現擔任Zoom前端架構師，推進前後端分離架構方案，同時負責Zoom自研組件庫 ZoomUI 的開發。專欄“Vue.js 3.0 核心源碼解析”作者，14k star 開源項目 better-scroll 作者。慕課網明星講師，教授“Vue.js 高仿開發餓了么外賣 App”“Vue 3 開發企業級音樂Web App”“Vue.js 源碼全方位深入解析”等課程，幫助上萬名學生完成 Vue.js 從入門到進階的學習。 “老黃的前端私房菜”主理人，不定期分享技術乾貨和軟素質技能。
