私はいくつかの線と矢印を描いており、一度に 100 以上の線と矢印を一度に画面に表示していますが、何らかの理由で IE1 はここで Chrome よりも優れています。矢印を描かなければ、速度はほぼ同じです。だから、IE10が線をレンダリングする方法とChromeが線をレンダリングする方法に何かがあると推測しました。
これがなぜなのか、またはChromeを高速化する可能性のあるキャンバスのヒントを知っている人はいますか?
以下は、コメント アウトすると Chrome がはるかに高速になる部分ですが、実際には IE10 にはまったく影響しないようです。
var risePercent2 = runPercent;
var runPercent2 = -risePercent;
var newX = targetX - (runPercent * (targetSize + arrowLength));
var newY = targetY - (risePercent * (targetSize + arrowLength));
context.moveTo(
newX + (runPercent2 * arrowWidth),
newY + (risePercent2 * arrowWidth)
);
context.lineTo(
targetX - (runPercent * (targetSize + (arrowWidth / 2))),
targetY - (risePercent * (targetSize + (arrowWidth / 2)))
);
context.lineTo(
newX - (runPercent2 * arrowWidth),
newY - (risePercent2 * arrowWidth)
);
context.strokeStyle = color;
context.stroke();