在画布中，拥有单个上下文或倍数是否更好？

Question

我目前正在开发一款js app。 我不是js专家，所以我要求提示。

我的问题是： 在具有上下文数组的画布中绘制是否是良好的实践（性能方面）或者最好是在内部包含所有绘图的单个上下文？

案例1：

for (i = 0; i < 8; i++) {
    contextAr[i] = canvasAr.getContext('2d');
    contextAr[i].beginPath();
    contextAr[i].arc(canvasAr.width / 2, canvasAr.height / 2, ...
}

案例2：

contextAr.beginPath();
contextAr.arc(...);
contextAr.moveTo(...);
contextAr.LineTo(...);

一个简单的例子可以是分为4个季度的圆圈。我应该用一个单一的上下文来对待抽奖，还是应该分开处理每个部分。 我认为我并没有完全理解上下文的含义。 contextAr [i] = canvasAr.getContext（＆＃39; 2d＆＃39;）;多余的电话？ 如果contextAr [i]具有相同的元素，我不会感到惊讶。

谢谢。

Answer 1

从同一个canvas元素中多次获取2D上下文是相当无意义的，因为将返回相同的上下文对象。

From the standard（我的重点） -

  

返回与上次返回方法相同的对象   用同样的第一个参数调用。

因此，常见的和最佳的做法是获取对每个canvas元素的上下文的单个引用并连续使用它。