Scratch底层架构源码分析

内容丰富：围绕核心模块，全面、系统地介绍Scratch技术生态的相关知识。 重点突出：围绕代码块、虚拟机、渲染和存储等核心技术多角度展开讲解。 深入浅出：以简单易懂的语言讲解深层次的架构知识，降低学习难度。 实用性强：针对Scratch开发过程中的常见疑点和难点进行系统性讲解。

本书从谷歌Blockly技术开始讲起，逐步深入到Scratch技术生态，对Scratch中的核心技术进行了深入分析和源码讲解，让读者不但可以系统地学习Scratch中的核心概念，而且还能深入理解其代码实现，为二次开发打下基础。
本书共7章，对核心技术进行了精讲，并对相关技术进行了介绍。本书涵盖的内容有Blockly简介、Scratch-blocks源码分析、Scratch-vm源码分析、Scratch-render源码分析、Scratch-storage源码分析、Scratch-gui源码分析，以及Scratch-paint、Scratch-audio和Scratch-parser的简单介绍及其相互联系和连接。
本书涉及软件开发的底层内容，深入Scratch的架构设计及源码实现，非常适合Scratch技术开发人员阅读，也适合作为相关研究机构的参考资料使用。

孟灿，毕业于北京师范大学，获工学硕士学位。对图形图像处理与模式识别有广泛研究。曾经就职于国内外一线互联网公司，有多年的互联网行业开发和管理经验，工作内容涉及算法、前端和后端等技术领域。2019年入职核桃编程教育公司，从事Scratch少儿编程教学研究和二次开发。

前言
本书知识结构导图
第1章 开始Scratch之旅1
1.1 Scratch概述1
1.1.1 Scratch发展历史1
1.1.2 Scratch技术生态2
1.1.3 Scratch使用现状2
1.1.4 Scratch源码分析的意义2
1.2 Webpack打包工具简介3
1.2.1 Webpack的核心概念3
1.3 NPM包管理工具简介4
1.3.1 NPM的组成4
1.3.2 NPM的使用场景4
1.4 小结5
第2章 Scratch-blocks：积木块源码分析6
2.1 Scratch-blocks概述6
2.1.1 Blockly技术简介6
2.1.2 Scratch-blocks与Blockly之间的关系8
2.1.3 Scratch-blocks的作用9
2.1.4 Scratch-blocks的分类9
2.2 Scratch-blocks代码结构与流程9
2.2.1 Scratch-blocks代码结构10
2.2.2 Scratch-blocks代码流程12
2.3 Scratch-blocks核心代码分析14
2.3.1 blockly_uncompressed_vertical.js：垂直方向的非压缩打包文件14
2.3.2 options.js：配置工作区17
2.3.3 inject.js：将Scratch-blocks注入页面19
2.3.4 workspace模块：工作区28
2.3.5 toolbox.js：工具箱34
2.3.6 Flyout模块：工具箱中的托盘38
2.3.7 xml.js：XML读写器46
2.3.8 event模块：各模块之间的通信54
2.3.9 Field模块：代码块上的域63
2.3.10 blockly.js：Blockly的核心JS库75
2.3.11 connection模块：代码块之间的连接81
2.3.12 input.js：代码块上的输入94
2.3.13 mutator.js：代码块的变形器97
2.3.14 extensions.js：代码块的扩展102
2.3.15 block.js：定义一个代码块105
2.4 小结120
第3章 Scratch-vm：虚拟机源码分析121
3.1 Scratch-vm概述121
3.1.1 Scratch-vm的职责121
3.2 Scratch-vm代码结构与流程122
3.2.1 Scratch-vm代码结构122
3.2.2 Scratch-vm代码流程123
3.3 Scratch-vm核心代码分析129
3.3.1 virtual-machine.js：最外层的API定义129
3.3.2 blocks模块：代码块原语的实现138
3.3.3 dispatch模块：消息派发系统151
3.3.4 engine模块：虚拟机的引擎155
3.3.5 serialization模块：序列化与反序列化188
3.3.6 sprite模块：精灵的渲染196
3.4 小结199
第4章 Scratch-render：渲染引擎源码分析200
4.1 Scratch-render渲染技术概述200
4.1.1 WebGL概述200
4.1.2 canvas概述201
4.1.3 twgl.js概述201
4.1.4 Scratch-render概述201
4.2 Scratch-render代码结构与流程202
4.2.1 Scratch-render代码结构202
4.2.2 Scratch-render代码流程203
4.3 Scratch-render核心代码分析211
4.3.1 twgl.js关键函数介绍212
4.3.2 RenderWebGL.js：渲染引擎最外层API的定义219
4.4 小结227
第5章 Scratch-storage：资源存储源码分析228
5.1 Scratch-storage概述228
5.1.1 什么是Scratch-storage228
5.1.2 Scratch-storage的主要内容229
5.2 Scratch-storage代码结构与流程229
5.2.1 Scratch-storage代码结构229
5.2.2 Scratch-storage代码流程230
5.3 Scratch-storage核心代码分析239
5.3.1 ProxyTool模块：网络代理工具239
5.3.2 FetchTool模块：基于Fetch的网络工具240
5.3.3 NetsTool模块：基于Nets的网络工具241
5.3.4 FetchWorkerTool模块：基于任务的网络工具241
5.4 小结245
第6章 Scratch-gui：图形化界面源码分析246
6.1 Scratch-gui概述246
6.1.1 Scratch-gui所处的位置246
6.1.2 Scratch-gui的主要内容247
6.2 React技术栈概述247
6.2.1 什么是React247
6.2.2 React关键技术248
6.2.3 什么是Redux249
6.2.4 react-redux介绍249
6.3 Scratch-gui代码结构与流程250
6.3.1 Scratch-gui代码结构250
6.3.2 Scratch-gui代码流程251
6.4 Scratch-gui核心代码分析261
6.5 小结275
第7章 Scratch生态其他项目276
7.1 Scratch-paint：绘图编辑器276
7.1.1 Scratch-paint目录结构276
7.1.2 Scratch-paint使用方法277
7.2 Scratch-audio：音频引擎279
7.2.1 Scratch-audio目录结构280
7.2.2 Scratch-audio在Scratch-gui中的使用280
7.3 Scratch-parser：解析验证工具283
7.3.1 Scratch-parser目录结构283
7.3.2 Scratch-parser在Scratch-vm中的使用283
7.4 小结284