浅谈利用缓存来优化HTML5 Canvas程序的性能

2020-04-24 18:59:39易采站长站整理

                        for(var i=1;i<this.r;i+=borderWidth){   
                            ctx.beginPath();   
                            ctx.strokeStyle = this.color[j];   
                            ctx.arc(this.x , this.y , i , 0 , 2*Math.PI);   
                            ctx.stroke();   
                            j++;   
                        }   
                        ctx.restore();   
                    } else{   
                        ctx.drawImage(this.cacheCanvas , this.x-this.r , this.y-this.r);   
                    }   
                },   
  
                cache:function(){   
                    this.cacheCtx.save();   
                    var j=0;   
                    this.cacheCtx.lineWidth = borderWidth;   
                    for(var i=1;i<this.r;i+=borderWidth){