在绘制之前剪切上下文是否有助于HTML5画布的性能

Can clipping the context before drawing help HTML5 canvas performance?

本文关键字：HTML5 有助于性能是否上下文绘制更新时间：2023-09-26

我正在研究HTML5游戏框架的工作原理，并想知道它所做的特定优化。

框架跟踪屏幕中可能已经改变的"脏"区域。如果一个实体与这样的区域重叠，那么它将被重新绘制。然而，首先，上下文只被裁剪到dirty区域。

这比简单地重新绘制整个图像更快吗?如果实体是通过一系列更复杂的画布命令来呈现的呢?

e:在思考了更多之后，我意识到为什么剪辑在游戏框架的背景下是至关重要的，而不管性能如何。不过我还是有点好奇，所以我就不提这个问题了

一方面，您可以通过不渲染不相交脏区域的实体来节省时间。但是，另一方面，你损失了时间，因为画布操作与剪辑是较慢的。

一些浏览器(Chrome)会跟踪你绘制的画布区域，并只更新屏幕的那一部分。还可以节省时间。

所以这样的东西是否有帮助取决于脏区域有多大(如果脏区域几乎和整个画布一样大，重画所有东西就会更快，而不需要剪切)和你有多少对象(你拥有的越多，你可以节省的时间就越多)。我想大多数时候是值得去做的。