第1章 Web前端技術基礎 1
1.1 現(xiàn)代Web前端技術發(fā)展概述 1
1.1.1 現(xiàn)代Web前端技術應用 1
1.1.2 現(xiàn)代Web前端技術概述 4
1.1.3 Web前端技術發(fā)展 6
1.2 瀏覽器應用基礎 10
1.2.1 瀏覽器組成結構 10
1.2.2 瀏覽器渲染引擎簡介 12
1.2.3 瀏覽器數(shù)據(jù)持久化存儲技術 20
1.3 前端高效開發(fā)技術 34
1.3.1 前端高效開發(fā)工具 34
1.3.2 前端高效調試工具 36
1.4 本章小結 42
第2章 前端與協(xié)議 43
2.1 HTTP協(xié)議簡介 43
2.1.1 HTTP協(xié)議概述 43
2.1.2 HTTP 1.1 45
2.1.3 HTTP 2 51
2.2 web安全機制 53
2.2.1 基礎安全知識 53
2.2.2 請求劫持與HTTPS 57
2.2.3 HTTPS協(xié)議通信過程 59
2.2.4 HTTPS協(xié)議解析 61
2.2.5 瀏覽器Web安全控制 63
2.3 前端實時協(xié)議 64
2.3.1 WebSocket通信機制 65
2.3.2 Poll和Long-poll 66
2.3.3 前端DDP協(xié)議 70
2.4 RESTful數(shù)據(jù)協(xié)議規(guī)范 71
2.5 與Native交互協(xié)議 73
2.5.1 Hybrid App應用概述 74
2.5.2 Web到Native協(xié)議調用 74
2.5.3 Native到Web協(xié)議調用 77
2.5.4 JSBridge設計規(guī)范 78
2.6 本章小結 81
第3章 前端三層結構與應用 82
3.1 HTML結構層基礎 83
3.1.1 必須要知道的DOCTYPE 83
3.1.2 Web語義化標簽 84
3.1.3 HTML糟糕的部分 87
3.1.4 AMP HTML 90
3.2 前端結構層演進 94
3.2.1 XML與HTML簡述 94
3.2.2 HTML5標準 95
3.2.3 HTML Web Component 96
3.3 瀏覽器腳本演進歷史 102
3.3.1 CoffeeScript時代 103
3.3.2 ECMAScript標準概述 105
3.3.3 TypeScript概況 105
3.3.4 JavaScript衍生腳本 106
3.4 JavaScript標準實踐 107
3.4.1 ECMAScript 5 107
3.4.2 ECMAScript 6 113
3.4.3 ECMAScript 7+ 128
3.4.4 TypeScript 130
3.5 前端表現(xiàn)層基礎 131
3.5.1 CSS發(fā)展概述 131
3.5.2 CSS選擇器與屬性 132
3.5.3 簡單的應用舉例 133
3.6 前端界面技術 135
3.6.1 CSS樣式統(tǒng)一化 136
3.6.2 CSS預處理 138
3.6.3 表現(xiàn)層動畫實現(xiàn) 141
3.6.4 CSS4與展望 149
3.7 響應式網站開發(fā)技術 149
3.7.1 響應式頁面實現(xiàn)概述 149
3.7.2 結構層響應式 152
3.7.3 表現(xiàn)層響應式 160
3.7.4 行為層響應式 166
3.8 本章小結 167
第4章 現(xiàn)代前端交互框架 168
4.1 直接DOM操作時代 168
4.2 MV*交互模式 176
4.2.1 前端MVC模式 176
4.2.2 前端MVP模式 180
4.2.3 前端MVVM模式 181
4.2.4 數(shù)據(jù)變更檢測示例 185
4.3 Virtual DOM交互模式 193
4.3.1 Virtual DOM設計理念 193
4.3.2 Virtual DOM的核心實現(xiàn) 196
4.4 前端MNV*時代 200
4.4.1 MNV*模式簡介 201
4.4.2 MNV*模式實現(xiàn)原理 201
4.5 本章小結 203
第5章 前端項目與技術實踐 204
5.1 前端開發(fā)規(guī)范 204
5.1.1 前端通用規(guī)范 205
5.1.2 前端HTML規(guī)范 208
5.1.3 前端CSS規(guī)范 212
5.1.4 ECMAScript 5常用規(guī)范 218
5.1.5 ECMAScript 6+ 參考規(guī)范 222
5.1.6 前端防御性編程規(guī)范 227
5.2 前端組件規(guī)范 229
5.2.1 UI組件規(guī)范 230
5.2.2 模塊化規(guī)范 233
5.2.3 項目組件化設計規(guī)范 237
5.3 自動化構建 242
5.3.1 自動化構建的目的 243
5.3.2 自動化構建原理 243
5.3.3 構建工具設計的問題 246
5.4 前端性能優(yōu)化 248
5.4.1 前端性能測試 248
5.4.2 桌面瀏覽器前端優(yōu)化策略 253
5.4.3 移動端瀏覽器前端優(yōu)化策略 258
5.5 前端用戶數(shù)據(jù)分析 266
5.5.1 用戶訪問統(tǒng)計 266
5.5.2 用戶行為分析 267
5.5.3 前端日志上報 270
5.5.4 前端性能分析上報 275
5.6 前端搜索引擎優(yōu)化基礎 275
5.6.1 title、keywords、description的優(yōu)化 275
5.6.2 語義化標簽的優(yōu)化 277
5.6.3 URL規(guī)范化 278
5.6.4 robots 279
5.6.5 sitemap 279
5.7 前端協(xié)作 280
5.7.1 溝通能力和溝通技巧 280
5.7.2 與產品經理的“對抗” 281
5.7.3 與后臺工程師的合作 281
5.7.4 與運維工程師的“周旋” 282
5.7.5 對前端團隊的支持 282
5.8 本章小結 283
第6章 前端跨棧技術 284
6.1 JavaScript跨后端實現(xiàn)技術 284
6.1.1 Node后端開發(fā)基礎概述 285
6.1.2 早期MEAN簡介 288
6.1.3 Node后端數(shù)據(jù)渲染 289
6.1.4 前后端同構概述 290
6.1.5 前后端同構實現(xiàn)原理 291
6.2 跨終端設計與實現(xiàn) 297
6.2.1 Hybrid技術趨勢 297
6.2.2 Hybrid實現(xiàn)方式 299
6.2.3 基于localStorage的資源離線和更新技術 301
6.2.4 基于Native與Web的資源離線和更新技術 308
6.2.5 資源覆蓋率統(tǒng)計 310
6.2.6 仍需要注意的問題 311
6.3 本章小結 312
第7章 未來前端時代 313
7.1 未來前端趨勢 314
7.1.1 新標準的進化與穩(wěn)定 314
7.1.2 應用開發(fā)技術趨于穩(wěn)定并將等待下一次革新 314
7.1.3 持續(xù)不斷的技術工具探索 315
7.1.4 瀏覽器平臺新特性的應用 315
7.1.5 更優(yōu)化的前端技術開發(fā)生態(tài) 315
7.1.6 前端新領域的出現(xiàn) 316
7.2 做一名優(yōu)秀的前端工程師 318
7.2.1 學會高效溝通 318
7.2.2 使用高效的開發(fā)工具 319
7.2.3 處理問題方法論 319
7.2.4 學會前端項目開發(fā)流程設計 320
7.2.5 持續(xù)的知識和經驗積累管理 321
7.2.6 切忌過分追求技術 321
7.2.7 必要的產品設計思維 322
7.3 本章小結 323