Flash與HTML 5 WebGL粒子系統效能比較

最近Michael Chaize使用HTML 5和Flash等技術實作了同樣一個粒子系統，並對其在不同瀏覽器，不同作業系統，不同平台（桌面和行動裝置）的效能進行了一個評測。可以看到，當粒子數達到4000時，Flash的表現已經是HTML 5的3倍。 但這個評測沒有使用到HTML 5 最新的WebGL Canvas。於是在原測試程式基礎上新加了基於WebGL的測試功能。

為了公平起見，粒子系統的計算採用原javascript 實現，沒有放到GPU的shader中計算。

測試網頁位址在這裡。

結果見下圖

這個粒子系統測試在使用HTML和2D Canvas時瓶頸完全在圖形的繪製上，而在使用WebGL後瓶頸轉移到了javascript對粒子系統的計算上。以上測試皆基於Chrome 5 Dev版，透過新增–enable-webgl 啟動參數啟用了WebGL功能。同時使用了Firefox Dev 版進行了比較，與Chrome有較大差距，甚至沒有與Chrome的普通圖形繪製方式拉開差距。

此測試中Flash是否啟用了GPU加速仍不得而知。今後瀏覽器使用GPU加速技術後，可以對HTML和2D Canvas的繪製進行加速，因此不用採用複雜的WebGL就能獲得較快的繪製速度。