Serverless架構下的前端開發：入門、實戰與進階

Contents　目　　錄
序1
序2
前言
第1章　Serverless 架構簡介 1
1.1　Serverless架構入門 1
1.1.1　發展歷程 1
1.1.2　定義 4
1.1.3　工作原理 6
1.1.4　生態發展 11
1.2　Serverless架構特性與挑戰 20
1.2.1　價值與優勢 20
1.2.2　風險與挑戰 26
1.3　Serverless架構應用場景 33
1.3.1　Web/行動應用後端場景 33
1.3.2　即時文件/資料處理 34
1.3.3　離線資料處理 35
1.3.4　人工智慧領域 35
1.3.5　IoT等領域 36
1.3.6　監控與自動化運作 36
第2章　零基礎上手 Serverless 架構 38
2.1　工業Serverless產品 38
2.1.1　阿里雲 Serverless 產品 38
2.1.2　AWS Serverless產品 45
2.2　開源 Serverless 專案 51
2.2.1　OpenWhisk 專案 51
2.2.2　Knative 項目 56
2.2.3　Kubeless項目 62
第3章　Serverless架構應用開發與最佳化探索 66
3.1　Serverless 架構與前端技術 66
3.2　Serverless開發流程探索 69
3.3　應用開發、建置與調試 74
3.3.1　應用開發 74
3.3.2　應用建置 77
3.3.3　應用調試 79
3.3.4　函數編排 86
3.4　CI/CD 88
3.4.1　與 GitHub Action 的整合 88
3.4.2　與Gitee Go的整合 90
3.4.3　與Jenkins的整合 92
3.4.4　與雲效的整合 94
3.5　Serverless與可觀測性 95
3.6　應用最佳化 97
3.6.1　冷啟動優化 98
3.6.2　文件上傳方案 106
3.6.3　文件持久化方案 107
3.6.4　慎用Web框架特性 107
3.6.5　專案結構策略 108
第4章　前端技術視角下的Serverless 架構 110
4.1　SSR：前端技術突破性能障礙 110
4.1.1　背景 110
4.1.2　SSR簡介 111
4.1.3　Serverless架構下的SSR實戰 111
4.1.4　總結 113
4.2　WebSocket技術在Serverless架構下的新面貌 114
4.2.1　背景 114
4.2.2　API閘道中的WebSocket原理解析 114
4.2.3　Serverless架構下的WebSocket實戰 117
4.2.4　總結 127
4.3　RESTful API與Serverless架構的融合 127
4.3.1　背景 127
4.3.2　RESTful API簡介 128
4.3.3　Serverless架構下的RESTful API 130
4.3.4　總結 135
4.4　Serverless架構下的GraphQL實作 135
4.4.1　背景 135
4.4.2　GraphQL簡介 136
4.4.3　Serverless 架構下的 GraphQL實戰 137
4.4.4　總結 149
4.5　前後端一體化：前端技術的風向標 149
4.5.1　背景 149
4.5.2　前後端一體化發展史 149
4.5.3　Serverless 架構下的前後端一體化實戰 151
4.5.4　總結 154
4.6　小程式/快應用：前端技術賦能行動端開發 154
4.6.1　背景 154
4.6.2　Serverless 架構下的天氣查詢小程式實戰 154
4.6.3　總結 161
4.7　WebAssembly：前端技術新篇章 162
4.7.1　背景 162
4.7.2　WebAssembly簡介 162
4.7.3　WebAssembly 實戰案例：HoloWeb 程式碼格式化 167
4.7.4　總結 170
4.8　傳統框架的 Serverless 化與 Serverless 架構 170
4.8.1　背景 170
4.8.2　傳統框架 Serverless 化 171
4.8.3　Serverless First 框架：Midway 174
第5章　Serverless 架構下的前端生產實戰案例 177
5.1　網頁全景錄影及 Puppeteer 功能設計與實現 177
5.1.1　背景 177
5.1.2　Puppeteer 簡介 178
5.1.3　Serverless架構下的網頁截圖功能 179
5.1.4　二次開發方案 182
5.1.5　總結 183
5.2　盲盒抽獎活動系統設計及實現 184
5.2.1　背景 184
5.2.2　技術架構 184
5.2.3　技術實現 186
5.2.4　效果預覽 191
5.2.5　總結 192
5.3　基於 Serverless 架構的頭像漫畫風處理小程式 192
5.3.1　背景 192
5.3.2　技術實現 193
5.3.3　效果預覽 202
5.3.4　總結 203
5.4　Serverless WebSocket：彈幕應用系統設計及實作 204
5.4.1　背景 204
5.4.2　技術架構 204
5.4.3　技術實現 205
5.4.4　效果預覽 210
5.4.5　總結 212
5.5　HTML與快應用實戰：簡易用戶回饋功能實踐 212
5.5.1　背景 212
5.5.2　技術架構 213
5.5.3　技術實現 213
5.5.4　效果預覽 217
5.5.5　總結 218
第6章　傳統內容管理系統Serverless化升級實戰 219
6.1　背景 219
6.2　需求明確 220
6.3　技術選型 220
6.4　專案設計 221
6.4.1　基礎架構設計 221
6.4.2　Jamstack 與性能提升設計 223
6.5　開發實作 225
6.5.1　模組 Serverless 化升級 225
6.5.2　API 網關設定與最佳化 227
6.5.3　可觀測能力完善 231
6.6　專案預覽 235
6.7　總結 236
第7章　基於 Serverless 架構的人工智慧相簿系統 238
7.1　背景 238
7.2　需求明確 239
7.3　技術選型 240
7.4　專案設計 241
7.4.1　基礎架構設計 241
7.4.2　小程式 UI 設計 242
7.4.3　資料庫設計 243
7.5　開發實作 247
7.5.1　資料庫相關 247
7.5.2　後端代碼 249
7.5.3　小程式相關 257
7.6　專案預覽 262
7.7　總結 264
第8章　基於Serverless架構的企業宣傳小程式 265
8.1　背景 265
8.2　需求明確 265
8.2.1　小程式功能 266
8.2.2　管理平台功能 266
8.2.3　其他需求點 266
8.3　技術選型 266
8.4　專案設計 267
8.4.1　基礎架構設計 267
8.4.2　小程式 UI 設計 268
8.4.3　資料庫設計 269
8.5　開發實作 271
8.5.1　資料庫相關 271
8.5.2　後端代碼 272
8.5.3　小程式相關 277
8.5.4　管理頁 283
8.6　專案預覽 286
8.6.1　小程式端 286
8.6.2　管理端 287
8.7　總結 290
第9章　新一代 UI 雲端錄製回放解決方案 291
9.1　背景 291
9.2　需求明確 292
9.3　技術選型 293
9.4　專案設計 294
9.5　開發實現 296
9.5.1　介面測試支援 296
9.5.2　本地調試 296
9.5.3　Cypress 測試用例實作範例 297
9.5.4　函數計算實現方案 298
9.6　技術特點 299
9.7　專案優勢 301
9.8　核心功能體驗 303
9.8.1　圖片一致性對比 303
9.8.2　一鍵切換瀏覽器執行案例 304
9.9　總結 306
第10章　基於 Serverless 架構的輕量WebIDE 服務 307
10.1　背景 307
10.2　需求明確 307
10.3　技術選用 308
10.4　專案設計 310
10.4.1　基礎架構設計 310
10.4.2　API 設計 311
10.4.3　資料庫設計 316
10.5　開發實現 317
10.5.1　Reverse Proxy 模組 317
10.5.2　服務安全加強 319
10.6　專案預覽 320
10.7　總結 323