目 录

第一篇 基础篇

第1章 现代Web应用开发：全新的纪元 ···································································2

1.1 单页应用概述 ·································2

1.1.1 从此不必刷新浏览器 ························2

1.1.2 前端需要深入业务 ···························3

1.1.3 SPA如何工作 ·································4

1.1.4 闲聊MVVM设计模式 ·····················11

1.1.5 与服务器端通信 ·····························12

1.1.6 SPA的优点和缺点 ··························18

1.2 异步与协程 ··································20

1.2.1 程序、进程、线程与协程 ·················20

1.2.2 并发基础 ······································23

1.2.3 I/O漫聊 ·······································25

1.2.4 反应式模式：epoll与Event Loop ·······26

1.3 HTTP那些事儿·····························27

1.3.1 HTTP 2的重要性 ···························27

1.3.2 大话协议 ······································28

1.3.3 HTTP 2的六板斧 ···························28

1.3.4 下一代的革命：HTTP 3 ···················30

第2章 ECMAScript与Python 3 ············································································31

2.1 JavaScript简史······························31

2.2 初识ECMAScript 2015 ···················32

2.2.1 ECMAScript与JavaScript的不同 ·······32

2.2.2 ECMAScript 2015有哪些变化 ···········32

2.2.3 不可不知的DOM ···························39

2.2.4 BOM简介 ····································40

2.3 新一代Python简述 ························40

2.3.1 经验之谈：为什么是Python ·············40

2.3.2 新版本的性能改进 ··························41

2.3.3 深究CPython 3.6的垃圾回收与建议 ···43

第3章 ECMAScript 2015 ····················································································47

3.1 搭建运行ECMAScript开发环境 ·······47

3.1.1 包管理工具NPM ···························47

3.1.2 安装ECMAScript 2015开发环境 ········48

3.1.3 配置JavaScript编辑器 ·····················51

3.2 ECMAScript 2015必知···················54

3.2.1 let和const ····································54

3.2.2 for循环 ·······································55

3.2.3 箭头函数 ······································57

3.2.4 默认参数 ······································57

3.2.5 参数的扩展—Spread操作符 ···········58

3.2.6 数据结构Map和原生对象················59

第二篇Vue篇

3.2.7 数据结构Set ·································61

3.2.8 迭代器工具 ···································61

3.2.9 详解生成器 ···································63

3.2.10 面向对象编程 ······························65

3.2.11 面向对象编程进阶 ························70

3.2.12 实战：利用ES 2015开发仿“反恐精英

CS”游戏 ····································74

第4章 Vue.js化繁为简 ·························································································82

4.1 初见Vue.js ··································82

4.1.1 解决了什么问题 ·····························82

4.1.2 Vue.js与jQuery的区别 ····················83

4.1.3 揭秘虚拟DOM ······························84

4.2 上手Vue.js ··································86

4.2.1 最简化安装 ···································86

4.2.2 分析由Vue.js构建网页····················87

4.2.3 数据如何渲染 ································91

4.2.4 必须了解的生命周期·······················93

4.3 常用模板语法指令 ·························98

4.3.1 v-if/v-else/v-else-if指令 ····················98

4.3.2 v-show指令 ································100

4.3.3 v-for指令 ···································100

4.3.4 v-bind指令·································102

4.3.5 v-on指令 ···································103

4.4 一招学会事件处理器 ·····················104

4.5 不得不懂的计算属性和侦听器 ·········105

4.5.1 计算属性 ····································105

4.5.2 侦听器 ·······································106

4.6 常用的表单处理 ···························107

4.6.1 v-model指令 ·······························107

4.6.2 省力的修饰符 ······························110

第5章 Vue.js进阶 ······························································································111

5.1 深入组件 ····································111

5.1.1 快速入门 ····································111

5.1.2 父组件与子组件间的数据通信 ·········113

5.1.3 不同组件间的数据通信··················117

5.2 掌握状态管理Vuex ·······················118

5.2.1 初始化Vuex ································118

5.2.2 state、mutation、action ··················119

5.2.3 getter的使用 ·······························125

5.2.4 Vuex辅助函数·····························126

5.2.5 Vuex的经验之谈··························128

5.3 SPA必备：路由···························130

5.3.1 Vue 路由基础······························130

5.3.2 常规路由匹配 ······························131

5.3.3 路由匹配 ····································135

5.3.4 编程式导航 ·································136

第6章前端工程化Webpack 4及部署 ····································································137

6.1 vue-cli打包编译 ···························137

6.2 取代CLI，从“零”揭秘Webpack 4 ····138

6.3 基础配置 ····································141

6.4 配置开发服务器 ···························145

6.5 配置生产的编译构建环境 ···············148

6.6 基于HTTP 2的Nginx部署 ·············153

第7章 加速Vue.js项目 ·······················································································155

7.1 打包优化与异步Vue.js ··················155

7.1.1 Webpack打包的工作机制 ···············155

7.1.2 惰性加载 ····································156

7.1.3 动态导入 ····································157

7.1.4 异步组件 ····································157

7.1.5 异步路由 ····································159

7.1.6 大型项目中异步Vuex解决方案 ·······159

7.1.7 打包优化中的反模式 ·····················165

7.2 图片惰性加载的实现原理 ···············167

7.2.1 IntersectionObserver API介绍 ··········167

7.2.2 在Vue.js中如何实现 ·····················168

7.2.3 性能之谈 ····································169

7.3 大文本惰性加载实战 ·····················171

7.3.1 定制组件 ····································172

7.3.2 指令：v-lazyload-text ·····················173

7.3.3 与服务器端对接 ···························173

7.4 优化资源优先级 ···························174

7.5 进击的性能Web Workers ················176

7.5.1 Web Workers与线程 ······················176

7.5.2 在Vue.js中如何实现 ·····················176

7.5.3 Vue.js多线程实战 ························178

7.5.4 Web Workers的限制 ······················183

7.6 离线优先Service Worker ················184

7.6.1 编写Service Worker注册脚本 ··········188

7.6.2 构建Service Worker ······················191

7.6.3 运行和调试 ·································193

7.6.4 Service Workers与Web Workers的

 区别 ··········································194

7.7 新一代图片格式WebP ···················194

7.7.1 WebP及其优缺点 ·························194

7.7.2 在Vue.js中如何实现 ·····················195

7.8 Web性能监测利器：Lighthouse ·······196

7.8.1 在开发者工具中运行 ·····················197

7.8.2 在命令行中运行 ···························197

7.8.3 在Chrome扩展程序中运行 ·············198

第三篇 Django篇

第8章 认识Django ····························································································200

8.1 解读Django架构 ·························200

8.1.1 全新视角的松耦合设计 ··················200

8.1.2 Django“视图”的正确理解 ············201

8.1.3 Django项目结构实践 ····················202

8.1.4 创建自己的Django应用程序 ··········205

8.1.5 URLconfs—Django路由 ··············206

8.1.6 快速开发HTTP接口 ·····················207

8.2 正确入手：Django ORM ················209

8.2.1 从社交应用程序中掌握ORM ··········209

8.2.2 模型定义的最佳实践 ····················213

8.2.3 QuerySets基础 ····························215

8.2.4 教你手写Active Record设计模式 ·····217

第9章 理解Django REST Framework ···································································219

9.1 为什么使用DRF ··························219

9.2 核心速学手册 ······························220

9.2.1 序列化 ·······································221

9.2.2 DRF的视图与路由 ·······················222

9.2.3 ModelSerializer源码揭秘与更多实例····224

9.2.4 认证与权限 ·································231

9.2.5 DRF动态绘制表单的设计模式 ········235

9.3 实战：用于SPA的无状态RESTful服务

器端接口·····································239

9.3.1 介绍 ··········································239

9.3.2 JWT用户认证 ·····························244

9.3.3 分页 ··········································247

9.3.4 正确返回及错误输出·····················249

9.3.5 单元测试 ····································250

9.3.6 性能检测 ····································252

第10章 Django生产部署的艺术 ··········································································253

10.1 准备 ········································253

10.1.1 剪裁Django·······························253

10.1.2 生产/测试开发环境隔离 ··············255

10.1.3 日志 ········································258

10.2 部署 ········································259

10.2.1 WSGI介绍 ································260

10.2.2 uWSGI基础 ······························261

10.2.3 uWSGI加速与KSM技术内存

抗泄 ········································263

10.2.4 深入理解uWSGI启动的机制 ·········266

10.2.5 结合Nginx与轻量化测试wrk ········268

10.3 换台“发动机”—PyPy 3 ···········270

10.3.1 Stackless的无堆栈与PyPy 3

新特性 ·····································271

10.3.2 PyPy 3 + uWSGI + Django 2生产实战

心得 ········································274

第11章终极优化Django ···················································································280

11.1 WSGI与Django ·························280

11.1.1 WSGI内存管理与OOM现象 ········280

11.1.2 一种内存预热的方式：重构WSGI···282

11.2 QuerySets优化与设计模式 ············286

11.2.1 QuerySets深度优化·····················287

11.2.2 解读Django 2最新QuerySets

源码 ········································291

11.2.3 设计“单例模型”减少数据库

连接 ········································295

11.2.4 有限状态机在Django模型中的

实践 ········································297

11.3 Django REST Framework优化指南 ···303

11.3.1 适当简化DRF ····························303

11.3.2 Varnish每秒进击45K并发 ············305

11.3.3 DRF 3.10.3版本的高性能揭秘 ·······306

11.4 第二代Django Channels ················308

11.4.1 Asyncio基础 ······························308

11.4.2 Asyncio高并发实践 ·····················310

11.4.3 再谈Asyncio与Gevent ················312

11.4.4 Asyncio与Django ·······················313

11.4.5 理解Django Channels ···················313

11.5 Django 3的异步驱动····················314

第四篇 综合案例篇

第12章 打造企业级分布式应用服务 ·····································································318

12.1 功能与需求介绍 ·························318

12.2 系统架构设计及环境说明 ·············319

12.3 构建前端页面 ····························320

12.3.1 用户交互设计 ····························321

12.3.2 Vue.js开发环境搭建 ····················321

12.3.3 构建页面布局 ····························323

12.3.4 创建Vue.js路由 ·························327

12.3.5 前端组件开发及通信 ···················328

12.3.6 表单验证 ··································337

12.4 客户端Agent技术 ······················339

12.4.1 守护进程与后台程序 ···················339

12.4.2 编写Agent框架 ·························340

12.4.3 实现aiohttp异步Web服务 ···········344

12.4.4 开发HTTP接口 ·························345

12.4.5 Agent嵌入异步Web服务 ·············346

12.4.6 asyncio.gather的妙用 ···················348

12.5 gRPC服务 ································350

12.5.1 编写ProtoBuf生成原型文件 ··········350

12.5.2 服务器端开发 ····························352

12.5.3 Agent的gRPC客户端开发 ············353

12.5.4 Asyncio异步gRPC ······················355

12.6 Django应用服务器 ······················357

12.6.1 搭建Django项目脚手架 ···············357

12.6.2 REST接口 ································358

12.6.3 前、后端接口交互 ······················359

12.7 Django Channels实战 ···················361

12.7.1 架构机制 ··································361

12.7.2 安装与Channels路由配置 ·············362

12.7.3 开发Consumer ···························364

12.7.4 gRPC与Django Channels的融合 ····365

12.7.5 Web应用编程接口：WebSocket API ···366

12.7.6 Channels部署方式及集群 ·············368

12.8 更多的讨论 ·······························369

12.8.1 gRPC负载均衡与性能测试实践 ·····369

12.8.2 服务注册与发现 ·························371

12.8.3 Agent性能 ································372

12.8.4 Django与MongoDB ····················372

后记···················································································································373