小程序
小游戏
企业微信
微信支付
扫描小程序码分享
在使用wx.createCanvasContext创建canvas context以后，通过settimeout绘制动画，当经过几次以后，发现fps从50多降低到5左右，动画由原来的很顺畅变得很卡，不知道是什么原因造成的。
4 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
你好，能提供一个简单可复现 DEMO 吗
你好，麻烦通过点击下方“反馈信息”按钮，提供出现问题的。
canvas.draw()在传true的时候会很卡。
因为代码结构比较复杂，主要是实现笔划绘制，我摘出一段大概如下的代码
start:
function
(b, a) {
var
that =
this
;
b.save();
b.beginPath();
b.rect(a.x, a.y, a.w, a.h);
b.clip();
b.fill();
b.setFillStyle(
"rgba(255,255,255,0)"
);
b.fillRect(a.x, a.y, a.w, a.h);
b.restore();
b.draw(
true
b.b = setTimeout(
() {
that.start(b, a)
}, 20);
}
也就是通过定时器反复绘制笔划，实现动态写字的效果，我打开性能调试的时候发现fps随着我不断调用就会一直降低，最后的动画也就变成一卡一卡的不流畅了，也找不到具体原因
你好，谢谢你的回复，我的小程序提交了审核还没通过，稍等我整理一个demo发给你，谢谢。
关注后，可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
你好，能提供一个简单可复现 DEMO 吗
因为代码结构比较复杂，主要是实现笔划绘制，我摘出一段大概如下的代码
start:function(b, a) {varthat =this;b.save();b.beginPath();b.rect(a.x, a.y, a.w, a.h);b.clip();b.beginPath();b.fill();b.beginPath();b.setFillStyle("rgba(255,255,255,0)");b.fillRect(a.x, a.y, a.w, a.h);b.restore();b.save();b.draw(true);b.b = setTimeout(function() {that.start(b, a)}, 20);}也就是通过定时器反复绘制笔划，实现动态写字的效果，我打开性能调试的时候发现fps随着我不断调用就会一直降低，最后的动画也就变成一卡一卡的不流畅了，也找不到具体原因
你好，谢谢你的回复，我的小程序提交了审核还没通过，稍等我整理一个demo发给你，谢谢。