canvas性能问题
发布于 6 年前 作者 maoyong 6022 次浏览 来自 问答

真机运行项目时（双端都是），随着时间的递增运行越来越卡，但是PC端就不会那么明显，哪里写错了吗？

4 回复

之前也碰到canvas绘制久了就越来越卡顿的问题，这个应该是微信原生canvas的bug，使用webview来处理的话，跑多久都不会变慢。

你使用下面这个代码来清除画布，可以把速度还原，但如果绘制久了，还是一样会再次变慢。

wx.drawCanvas({

        canvasId: ‘canvasId’,

        actions: [],

        reserve: false

      })

https://developers.weixin.qq.com/s/Krp10nmn7H3k主要优化两点1. 使用 requestAnimationFrame 进行帧绘制，能保证在绘制耗时比较大的情况下自动降帧而不丢帧。即使是使用 setTimeout 也尽量不要使用 setInterval，setInterval 会在计时器触发时直接执行，而这时上一帧的绘制过程可能因为某些原因还未完毕。

  1. storke, clear, draw 的过程尽量在每一帧绘制时一次性执行。

获取数据你可以开个worker线程，应该是不存在运行时间越久越卡顿这种情况的

哇 这示波器效果~

你12条线路是单独画的，每条线路会有单独的定时器，但是事件处理队列是同一个，也就是相当于是系统有3ms来完成一截图的绘制。。手机上性能远不如PC（龙芯机器除外）。。如果每条线的进度可以是一样的，能不能试试用一个定时器来做，每次画这一竖条下来

回到顶部