什麼是在HTML5畫布上繪圖的最佳實踐，提示和陷阱

我試圖在HTML5畫布上繪製大圖像（5000 * 5000 px）。這樣做的最佳做法是什麼？什麼是在HTML5畫布上繪圖的最佳實踐，提示和陷阱

你們可以爲你推薦最好的閱讀材料並分享你的個人經驗嗎？

以下是我目前所知：

Double buffering images - >非常適合你的速度。

Anti-aliased images - >真棒圖像的質量，即使調整

A good tip - >如果你打算使用putImageData（）

我作爲一個HTML5遊戲開發的經驗是，這兩種做法都是真的很棒，我使用它們兩者。

When displaying lots of complex objects（我不知道它是否有關，但可能會派上用場，它是真正偉大學習如何正確地做到這一點）

也; this

2013-12-12 15:25:30

畫布不需要雙緩衝。如果你看看那篇文章，你鏈接的文章在評論中被揭穿了。其他技巧並不差。 – Loktar

好吧，我的壞。可能是錯誤的鏈接！非常有趣的閱讀，但：http://www.html5rocks.com/en/tutorials/canvas/performance/ –

這取決於你在做什麼，但如果你計劃在5000px5000px左右滾動圖像，我肯定會把它分成幾個部分或圖塊，並使用drawImage來繪製用戶將看到的部分。

對於繪製大圖像，您將看到使用putImageData的效果下降，其中drawImage的效果會降低。 putImageData在使用粒子等做任何事情時都很棒。基本上，當您在屏幕上繪製大量小塊時，可以使用putImageData輕鬆繪製100,000個對象。

性能和內存使用不應該是一個問題，如果你只繪製部分用戶可以看到，即使赫克全5000x5000不應該是太太大的問題的誠實。大多數瀏覽器應該能夠處理它，你所做的並不罕見。

Here is a poor unfinished example I was working on for a previous employer該示例使用了一噸瓷磚，甚至實現了碰撞和尋路並且運行良好。如果我只是畫出一張大的地圖圖像，如果我沒有記錯的話，大概是10000x10000（每個圖塊都是64x64）

2013-12-12 15:48:25 Loktar

回答