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

在使用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 吗

回到顶部