Scratch底層架構(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-storage     228
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)絡(luò)代理工具     239
5.3.2  FetchTool模塊：基于Fetch的網(wǎng)絡(luò)工具       240
5.3.3  NetsTool模塊：基于Nets的網(wǎng)絡(luò)工具   241
5.3.4  FetchWorkerTool模塊：基于任務(wù)的網(wǎng)絡(luò)工具      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  什么是React     247
6.2.2  React關(guān)鍵技術(shù)  248
6.2.3  什么是Redux    249
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