關卡配置：每一關的戰場地形配置，一關內會出現的敵對坦克的數量和等級；
數值配置：例如子彈的速度，坦克的移動速度，道具鏟子的持續時間等；
遊戲場景：遊戲開始/結束場景，關卡結算場景等；
音效（該復刻版的音效部分尚未完成）。
左側的輪胎(left-tire)： 輪胎的背景色 & 輪胎上的花紋
右側的輪胎(right-tire)：輪胎的背景色 & 輪胎上的花紋
坦克主體(tank-body)： 坦克主體的輪廓 & 坦克主體上的裝飾
坦克炮管(gun)：乙個矩形
export
class
battlefield
extends
react.purecomponent
height= fill="#000000" />
rivers= />
steels= />
bricks= />
snows= />
x=y=
broken= />
classname="bullet-layer">
bullet= />)}
>
classname="power-up-layer">
powerup= />)}
>
)}}
來過濾掉不需要的 re-render。遊戲執行時，只有一小部分的元件會不斷更新（例如坦克和子彈），大部分的元件（例如遊戲中的地形元素）保持不變。這些不怎麼變化的元件，在很多時候，前後兩次接收到的 props 是相等的（shallow-equal）。讓元件繼承自react.purecomponent，就可以跳過該元件大部分額外的 re-render 。經過該步優化後，整個遊戲的幀率大幅上公升，大部分情況下可以到達 60 fps。對於那些一直在變化的元件（例如子彈等），應用 purecomponent 的收益很小，也許 react.component 更為合適。不過我在實際程式設計中也沒考慮那麼多，全盤使用了 purecomponent。
import from
'react-dom/server'
const svgns = ''
// imagekey 到 object-url 的對映，乙個 imagekey 對應了一張儲存好的
const cache = new map()
class image extends react.purecomponent = this.props
if (!cache.has(imagekey)) )
const url = url.createobjecturl(blob)
cache.set(imagekey, url)
}return }
}// 其他地方像這樣使用 class othercomponentusingimage extends react.purecomponent
)}}
// 整個遊戲的資料結構
inte***ce state
什麼時候建立 saga 例項？什麼時候結束 saga 執行？
乙個 saga 例項執行之後可能會管理一些遊戲元素（子彈/地形/坦克等），如果該 saga 例項被 cancel，那麼需要執行哪些清理操作？（cancel 時的清理操作一般放在 finally block 中）
乙個 saga 例項執行時，可以保證哪些條件一定滿足？
attacheaglemode 攻擊老鷹模式：在此模式下，ai 坦克會選取乙個能擊中老鷹的目標位置，然後計算一條路徑並進行「路徑跟隨」，到達目標位置之後坦克會向老鷹進行**。
React 設計高質量的React元件
react應用將圍繞著元件的設計展開，所以關於元件的設計至關重要。任何乙個複雜的應用，都是由乙個簡單的應用發展而來。軟體設計的通則 高內聚，低耦合。在前端開發中，html負責頁面顯示，互動放在js，樣式放在css檔案，從功能角度來說，模組劃分明確，但是不滿足高內聚的原則。react則是天生高內聚，展...
高質量設計的特徵
高質量的設計具有很多常見的特徵。如果你能實現所有這些目標，你的設計就真的非常好了。這些目標之間有時會相互牴觸，但這也正是設計中的挑戰所在 在一系列相互競爭的目標之中做出一套最好的折中方案。有些高質量設計的特徵也同樣是 高質量程式的特徵，如可靠性和效能等。而有些則只是設計範疇內的特徵。下面就列出一些設...
高質量的子程式
1.什麼是子程式？子程式是為實現乙個特定的目的而編寫的乙個可被呼叫的方法或過程。2.建立子程式的理由 除此之外還有很多其他的理由比如 隔離複雜度，隱藏實現細節，限制變化帶來的影響，隱藏全域性資料，形成 控制點，促成可重用 達到特定的重構牧的等等。在子程式層上設計 內聚性 指子程式中各種操作之間聯絡的...