如何优化canvas，每20Hz重画一次，如何进行优化？

Question

如何优化canvas，每20Hz重画一次，如何进行优化？

采用websocket接收后端数据，使用canvas画点，线，弧线，点我是通过画圆画的，
20Hz的频率下，页面是不卡的，其他部分还可以操作，40Hz的频率下，页面特别卡，
请问是我canvas画图部分的处理有问题还是前端在高频刷新下就是会这样？

Answer 1

打开任务管理器，切换到性能，看cpu和gpu占用率。
如果cpu占用率高，说明你的js代码不高效。
高效的做法是，使用双缓冲，或者将canvas分块，每次只绘制图像变动受到影响的小块。