本節書摘來自異步社區《JavaScript高效圖形編程（修訂版）》一書中的第6章，第6.10節，作者：【美】Raffaele Cecco著，更多章節內容可以訪問云棲社區“異步社區”公眾號查看

6.10 用畫布sprites取代DHTMLsprite

在第2章中，我們開發了DHTML sprite動畫系統，并用它創建了各種圖形演示。在第5章中，我們用這個系統制作了一個DHTML視頻游戲。我們盡量將繪制sprites的細節“隱藏”在DHTMLSprite對象中，使得應用程序可以很容易實現和使用一個不同的sprite系統。現在我們將在演示中使用一個新的CanvasSprite對象，它利用了性能更強的畫布元素。

6.10.1　新CanvasSprite對象
CanvasSprite是DHTMLSprite對象的一個直接替換。除了加了一個畫布環境參數（ctx）外，params對象的所有參數都和以前一樣被傳入：

警告：
注意我們使用移位運算符（x>>0，y>>0）確保渲染位置為整數。Firefox和Opera瀏覽器在分數像素位置繪制時性能會有很大影響。這對普通繪圖影響不大，但對高速圖形應用，將非常影響性能。
6.10.2　其他的代碼更改
下面的代碼中粗體標注的是讓CanvasSprite工作所需做的其他修改。你可以參考第2章中DHTMLSprite的代碼進行比較。

總結

以上是生活随笔為你收集整理的《JavaScript高效图形编程（修订版）》——6.10 用画布sprites取代DHTMLsprite的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。