前言
本書知識結(jié)構(gòu)導圖
第1章 開始Scratch之旅1
1.1 Scratch概述1
1.1.1 Scratch發(fā)展歷史1
1.1.2 Scratch技術(shù)生態(tài)2
1.1.3 Scratch使用現(xiàn)狀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 小結(jié)5
第2章 Scratch-blocks：積木塊源碼分析6
2.1 Scratch-blocks概述6
2.1.1 Blockly技術(shù)簡介6
2.1.2 Scratch-blocks與Blockly之間的關(guān)系8
2.1.3 Scratch-blocks的作用9
2.1.4 Scratch-blocks的分類9
2.2 Scratch-blocks代碼結(jié)構(gòu)與流程9
2.2.1 Scratch-blocks代碼結(jié)構(gòu)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：配置工作區(qū)17
2.3.3 inject.js：將Scratch-blocks注入頁面19
2.3.4 workspace模塊：工作區(qū)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 小結(jié)120
第3章 Scratch-vm：虛擬機源碼分析121
3.1 Scratch-vm概述121
3.1.1 Scratch-vm的職責121
3.2 Scratch-vm代碼結(jié)構(gòu)與流程122
3.2.1 Scratch-vm代碼結(jié)構(gòu)122
3.2.2 Scratch-vm代碼流程123
3.3 Scratch-vm核心代碼分析129
3.3.1 virtual-machine.js：最外層的API定義129
3.3.2 blocks模塊：代碼塊原語的實現(xiàn)138
3.3.3 dispatch模塊：消息派發(fā)系統(tǒng)151
3.3.4 engine模塊：虛擬機的引擎155
3.3.5 serialization模塊：序列化與反序列化188
3.3.6 sprite模塊：精靈的渲染196
3.4 小結(jié)199
第4章 Scratch-render：渲染引擎源碼分析200
4.1 Scratch-render渲染技術(shù)概述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代碼結(jié)構(gòu)與流程202
4.2.1 Scratch-render代碼結(jié)構(gòu)202
4.2.2 Scratch-render代碼流程203
4.3 Scratch-render核心代碼分析211
4.3.1 twgl.js關(guān)鍵函數(shù)介紹212
4.3.2 RenderWebGL.js：渲染引擎最外層API的定義219
4.4 小結(jié)227
第5章 Scratch-storage：資源存儲源碼分析228
5.1 Scratch-storage概述228
5.1.1 什么是Scratch-storage228
5.1.2 Scratch-storage的主要內(nèi)容229
5.2 Scratch-storage代碼結(jié)構(gòu)與流程229
5.2.1 Scratch-storage代碼結(jié)構(gòu)229
5.2.2 Scratch-storage代碼流程230
5.3 Scratch-storage核心代碼分析239
5.3.1 ProxyTool模塊：網(wǎng)絡代理工具239
5.3.2 FetchTool模塊：基于Fetch的網(wǎng)絡工具240
5.3.3 NetsTool模塊：基于Nets的網(wǎng)絡工具241
5.3.4 FetchWorkerTool模塊：基于任務的網(wǎng)絡工具241
5.4 小結(jié)245
第6章 Scratch-gui：圖形化界面源碼分析246
6.1 Scratch-gui概述246
6.1.1 Scratch-gui所處的位置246
6.1.2 Scratch-gui的主要內(nèi)容247
6.2 React技術(shù)棧概述247
6.2.1 什么是React247
6.2.2 React關(guān)鍵技術(shù)248
6.2.3 什么是Redux249
6.2.4 react-redux介紹249
6.3 Scratch-gui代碼結(jié)構(gòu)與流程250
6.3.1 Scratch-gui代碼結(jié)構(gòu)250
6.3.2 Scratch-gui代碼流程251
6.4 Scratch-gui核心代碼分析261
6.5 小結(jié)275
第7章 Scratch生態(tài)其他項目276
7.1 Scratch-paint：繪圖編輯器276
7.1.1 Scratch-paint目錄結(jié)構(gòu)276
7.1.2 Scratch-paint使用方法277
7.2 Scratch-audio：音頻引擎279
7.2.1 Scratch-audio目錄結(jié)構(gòu)280
7.2.2 Scratch-audio在Scratch-gui中的使用280
7.3 Scratch-parser：解析驗證工具283
7.3.1 Scratch-parser目錄結(jié)構(gòu)283
7.3.2 Scratch-parser在Scratch-vm中的使用283
7.4 小結(jié)284