canvas多次打开 fps不断降低
发布于 5 年前 作者 yanluo 20068 次浏览 来自 问答

在使用wx.createCanvasContext创建canvas context以后，通过settimeout绘制动画，当经过几次以后，发现fps从50多降低到5左右，动画由原来的很顺畅变得很卡，不知道是什么原因造成的。

4 回复

你好，谢谢你的回复，我的小程序提交了审核还没通过，稍等我整理一个demo发给你，谢谢。

因为代码结构比较复杂，主要是实现笔划绘制，我摘出一段大概如下的代码

start: function(b, a) {
        var that = 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随着我不断调用就会一直降低，最后的动画也就变成一卡一卡的不流畅了，也找不到具体原因

canvas.draw()在传true的时候会很卡。

你好，能提供一个简单可复现 DEMO 吗

回到顶部