前端架构师：基础建设与架构设计思想
链接：https://pan.baidu.com/s/1FCTo6JmKY3Ljqiu0gDCrsw?pwd=rvi1
提取码：rvi1
快速发展的红利、优胜劣汰的挑战、与生俱来的混乱、同混乱抗衡的规范……这些都是前端从业者无法逃避的现状。有人说，做好业务支撑是活在当下，而做好技术基建是活好未来。当业务量到达一定量级时，成为“规范制定者”，成为“思考者”，像“架构师”一样思考问题，才能最终成为“优胜者”。本书内容不是简单的思维模式输出，不是纯粹“阳春白雪”的理论，也不是社区搜索即得的 Webpack配置罗列和原理复述，而是从项目痛点中提取出的基础建设的意义，以及从个人发展瓶颈中总结出的工程化架构和底层设计原理。本书不仅能帮助开发者夯实基础，还能为开发者实现技术进阶提供帮助和启发。
目 录
第一部分 前端工程化管理工具
01 安装机制及企业级部署私服原理 ................................................................ 2
npm 内部机制与核心原理 ...................................................................................................... 2
npm 不完全指南 ...................................................................................................................... 6
npm 多源镜像和企业级部署私服原理 .................................................................................. 9
总结 ........................................................................................................................................ 11
02 Yarn 安装理念及依赖管理困境破解 .......................................................... 12
Yarn 的安装机制和背后思想 ................................................................................................ 14
破解依赖管理困境 ................................................................................................................ 17
总结 ........................................................................................................................................ 21
03 CI 环境下的 npm 优化及工程化问题解析 ................................................. 22
CI 环境下的 npm 优化 .......................................................................................................... 22
更多工程化相关问题解析 .................................................................................................... 23
最佳实操建议 ........................................................................................................................ 30
总结 ........................................................................................................................................ 31
04 主流构建工具的设计考量 ......................................................................... 32
从 Tooling.Report 中，我们能学到什么 .............................................................................. 32
总结 ........................................................................................................................................ 36
05 Vite 实现：源码分析与工程构建 ............................................................... 37
Vite 的“横空出世”............................................................................................................. 37
Vite 实现原理解读 ................................................................................................................ 38
总结 ........................................................................................................................................ 50
第二部分 现代化前端开发和架构生态
06 谈谈 core-js 及 polyfill 理念 ...................................................................... 52
core-js 工程一览 .................................................................................................................... 52
如何复用一个 polyfill ........................................................................................................... 54
寻找最佳的 polyfill 方案 ...................................................................................................... 59
总结 ........................................................................................................................................ 62
07 梳理混乱的 Babel，拒绝编译报错 ............................................................ 63
Babel 是什么 .......................................................................................................................... 63
Babel Monorepo 架构包解析 ................................................................................................ 64
Babel 工程生态架构设计和分层理念 .................................................................................. 75
总结 ........................................................................................................................................ 78
08 前端工具链：统一标准化的 babel-preset ................................................. 79
从公共库处理的问题，谈如何做好“扫雷人” ................................................................. 79
应用项目构建和公共库构建的差异 .................................................................................... 81
一个企业级公共库的设计原则 ............................................................................................ 81
制定一个统一标准化的 babel-preset .................................................................................... 82
总结 ........................................................................................................................................ 91
09 从 0 到 1 构建一个符合标准的公共库 ....................................................... 92
实战打造一个公共库 ............................................................................................................ 92
打造公共库，支持 script 标签引入代码 .............................................................................. 96
打造公共库，支持 Node.js 环境 ........................................................................................ 100
从开源库总结生态设计 ...................................................................................................... 103
总结 ...................................................................................................................................... 104
10 代码拆分与按需加载 .............................................................................. 105
代码拆分与按需加载的应用场景 ...................................................................................... 105
代码拆分与按需加载技术的实现 ...................................................................................... 106
Webpack 赋能代码拆分和按需加载 ................................................................................... 113
总结 ...................................................................................................................................... 119
11 Tree Shaking：移除 JavaScript 上下文中的未引用代码 ......................... 120
Tree Shaking 必会理论 ........................................................................................................ 120
前端工程化生态和 Tree Shaking 实践 ............................................................................... 124
总结 ...................................................................................................................................... 131
12 理解 AST 实现和编译原理 ...................................................................... 132
AST 基础知识 ..................................................................................................................... 132
AST 实战：实现一个简易 Tree Shaking 脚本 ................................................................... 136
总结 ...................................................................................................................................... 141
13 工程化思维：应用主题切换 .................................................................... 142
设计一个主题切换工程架构 .............................................................................................. 142
主题色切换架构实现 .......................................................................................................... 145
总结 ...................................................................................................................................... 150
14 解析 Webpack 源码，实现工具构建 ....................................................... 151
Webpack 的初心和奥秘 ...................................................................................................... 151
手动实现打包器 .................................................................................................................. 156
总结 ...................................................................................................................................... 160
15 跨端解析小程序多端方案 ....................................................................... 161
小程序多端方案概览 .......................................................................................................... 161
小程序多端——编译时方案 ............................................................................................... 162
小程序多端——运行时方案 ............................................................................................... 164
小程序多端——类 React 风格的编译时和运行时结合方案 ............................................ 166
小程序多端方案的优化 ...................................................................................................... 176
总结 ...................................................................................................................................... 178
16 从移动端跨平台到 Flutter 的技术变革 .................................................... 179
移动端跨平台技术原理和变迁 .......................................................................................... 179
Flutter 新贵背后的技术变革 ............................................................................................... 188
总结 ...................................................................................................................................... 194
第三部分 核心框架原理与代码设计模式
17 axios：封装一个结构清晰的 Fetch 库 .................................................... 196
设计请求库需要考虑哪些问题 .......................................................................................... 196
axios 设计之美 ..................................................................................................................... 199
总结 ...................................................................................................................................... 206
18 对比 Koa 和 Redux：解析前端中间件 .................................................... 207
以 Koa 为代表的 Node.js 中间件设计 ............................................................................... 207
对比 Express，再谈 Koa 中间件 ........................................................................................ 210
Redux 中间件设计和实现 ................................................................................................... 213
利用中间件思想，实现一个中间件化的 Fetch 库 ............................................................ 215
总结 ...................................................................................................................................... 218
19 软件开发灵活性和高定制性 .................................................................... 219
设计模式 .............................................................................................................................. 219
函数式思想应用 .................................................................................................................. 223
总结 ...................................................................................................................................... 227
20 理解前端中的面向对象思想 .................................................................... 228
实现 new 没有那么容易 ...................................................................................................... 228
如何优雅地实现继承 .......................................................................................................... 230
jQuery 中的面向对象思想 .................................................................................................. 234
类继承和原型继承的区别 .................................................................................................. 236
总结 ...................................................................................................................................... 237
21 利用 JavaScript 实现经典数据结构 ........................................................ 238
数据结构简介 ...................................................................................................................... 238
堆栈和队列 .......................................................................................................................... 239
链表（单向链表和双向链表） .......................................................................................... 241
树 .......................................................................................................................................... 247
图 .......................................................................................................................................... 251
总结 ...................................................................................................................................... 255
22 剖析前端数据结构的应用场景 ................................................................ 256
堆栈和队列的应用 .............................................................................................................. 256
链表的应用 .......................................................................................................................... 257
树的应用 .............................................................................................................................. 260
总结 ...................................................................................................................................... 263
第四部分 前端架构设计实战
23 npm scripts：打造一体化构建和部署流程 .............................................. 266
npm scripts 是什么 ............................................................................................................... 266
npm scripts 原理 ................................................................................................................... 267
npm scripts 使用技巧 ........................................................................................................... 269
打造一个 lucas-scripts ......................................................................................................... 270
总结 ...................................................................................................................................... 276
24 自动化代码检查：剖析 Lint 工具 ............................................................ 277
自动化工具 .......................................................................................................................... 277
lucas-scripts 中的 Lint 配置最佳实践 ................................................................................. 281
工具背后的技术原理和设计 .............................................................................................. 283
总结 ...................................................................................................................................... 285
25 前端+移动端离线包方案设计 .................................................................. 286
从流程图分析 hybrid 性能痛点 .......................................................................................... 286
相应优化策略 ...................................................................................................................... 287
离线包方案 .......................................................................................................................... 289
方案持续优化 ...................................................................................................................... 293
总结 ...................................................................................................................................... 294
26 设计一个“万能”的项目脚手架 ............................................................ 295
命令行工具的原理和实现 .................................................................................................. 295
从命令行到万能脚手架 ...................................................................................................... 304
总结 ...................................................................................................................................... 306
第五部分 前端全链路——Node.js 全栈开发
27 同构渲染架构：实现 SSR 应用 .............................................................. 308
实现一个简易的 SSR 应用 ................................................................................................. 308
SSR 应用中容易忽略的细节 .............................................................................................. 312
总结 ...................................................................................................................................... 317
28 性能守卫系统设计：完善 CI/CD 流程 ..................................................... 318
性能守卫理论基础 .............................................................................................................. 318
Lighthouse 原理介绍 ........................................................................................................... 319
性能守卫系统 Perf-patronus ............................................................................................... 322
总结 ...................................................................................................................................... 328
29 打造网关：改造企业 BFF 方案 ............................................................... 329
BFF 网关介绍和优缺点梳理 .............................................................................................. 329
打造 BFF 网关需要考虑的问题 ......................................................................................... 330
实现一个 lucas-gateway ...................................................................................................... 333
总结 ...................................................................................................................................... 340
30 实现高可用：Puppeteer 实战 ................................................................. 341
Puppeteer 简介和原理 ......................................................................................................... 341
Puppeteer 在 SSR 中的应用 ................................................................................................ 342
Puppeteer 在 UI 测试中的应用 ........................................................................................... 345
Puppeteer 结合 Lighthouse 的应用场景 ............................................................................. 345
通过 Puppeteer 实现海报 Node.js 服务 .............................................................................. 347
总结 ...............................................................................................................................353
