且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

画布绘制非常慢

更新时间:2023-02-25 19:06:27

这不是 drawBlackMarkers 本身,是这样:

for (let y = (initialValY), scaleCountY = scaleCountStartValueOfY;
  y <= (rangeValY) && scaleCountY <= scaleCountRangeValueOfY;
  y += scaleInceremnt, scaleCountY += incrementFactor) {

这种情况不断增加,发生了640,000次。您可以这样写:

This is constantly increasing and happening 640,000 times. You can tell that's the case by writing:

  // to draw scale lines on canvas
  // drawBlackMarkers(y, coordinateMeasurment);
  console.log(y);

并查看控制台结果。

所以for循环几乎没有,因为大多数代码都在switch语句后面,并且甚至在执行此简单的 drawBlackMarkers 之外时,它仍显示该循环的真实成本。 rangeValY 是640,000,这意味着画布上下文必须构造的路径非常大。

So that for loop does very little, because most of it is behind a switch statement, and when it does even this simple drawBlackMarkers outside its showing the true cost of that loop. rangeValY is 640,000, which means the path the canvas context must construct is enormous.

因此,要解决这个问题,您必须找到一种方法改善这个问题。

So to fix this you must find a way to ameliorate that problem.