前端技术架构与工程

明确业务、架构与工程三者之间的关系是研究前端技术架构和工程化的基本前提：业务为核心出发点，架构聚焦于代码，工程聚焦于流程。在此基础之上，本书进一步剖析并明确架构与工程的子集与超集关系。从架构的角度分析一个完整Web项目在前端以及前后端协作层面需要考虑的各项技术要点和解决方案；在业务需求以及应用质量得到保障的基础之上，进一步从工程的角度分析迭代流程中可能阻碍工作效率的各个环节和关键因素，并讲解如何通过技术手段提升团队的规范性和生产效率。

第1章 前端工程化 1
1.1 前端的时代意义 2
1.2 架构与工程 9
1.3 零散的前端架构 12
1.4 模糊的前端工程边界 14
1.5 前端架构师的职责 16
1.5.1 技术架构 16
1.5.2 工程服务体系 20
1.6 总结 23
第2章 编程语言 24
2.1 HTML 25
2.1.1 SSR 26
2.1.2 CSR 28
2.2 CSS 34
2.2.1 从编程语言的角度思考CSS 37
2.2.2 LESS和PostCSS 40
2.2.3 CSS-in-JS 42
2.2.4 Houdini 45
2.3 JavaScript 46
2.3.1 静态类型 48
2.3.2 不可变性 51
2.3.3 异步编程 53
2.4 总结 59
第3章 技术规范 61
3.1 技术选型 62
3.2 资源管理 65
3.2.1 目录结构 66
3.2.2 命名规范 70
3.3 编码风格 73
3.3.1 JavaScript的高性能与易读性 77
3.3.2 CSS编程范式与面向对象 79
3.4 总结 85
第4章 组件化 87
4.1 组件与模块 88
4.2 Web Components 93
4.2.1 自定义元素 94
4.2.2 Shadow DOM 104
4.2.3 HTML template 109
4.3 更友好的编码方式 115
4.3.1 多文件组件 116
4.3.2 单文件组件 120
4.4 设计模式 121
4.4.1 重新思考DOM 122
4.4.2 生命周期的设计艺术 123
4.5 总结 124
第5章 前后端分离 125
5.1 关注点分离 126
5.2 SPA与路由管理 129
5.2.1 Hash模式 130
5.2.2 History模式 136
5.3 Node.js中间层与同构编程 138
5.3.1 同构JavaScript 140
5.3.2 React同构方案 141
5.4 总结 150
第6章 性能 151
6.1 性能评估模型 152
6.2 从URL到图像 156
6.2.1 网络 159
6.2.2 渲染 166
6.3 内存管理 170
6.3.1 GC算法 171
6.3.2 内存泄漏 177
6.4 极限运算性能 180
6.5 总结 184
第7章 工程思维与服务支撑 185
7.1 工程思维 186
7.2 开发支撑 189
7.2.1 脚手架 190
7.2.2 构建 192
7.2.3 dev server 200
7.2.4 源码管理 201
7.3 测试支撑 207
7.3.1 测试模型 208
7.3.2 依赖注入 213
7.3.3 前后端集成 214
7.4 运维支撑 215
7.4.1 一键部署 216
7.4.2 日志埋点 217
7.4.3 性能监控 221
7.5 总结 222
第8章 DevOps与Serverless 223
8.1 DevOps与敏捷开发 224
8.1.1 敏捷开发 224
8.1.2 DevOps 228
8.2 持续交付 230
8.2.1 持续集成 230
8.2.2 低风险发布 234
8.3 Serverless与前端 236
8.3.1 BFF 236
8.3.2 Serverless 239
8.4 总结 242