Canvas动画 位图缓存提高效率和对应的内存问题

    p.cache = function(x, y, width, height, scale) {
        // draw to canvas.
        scale = scale||1;
        if (!this.cacheCanvas) { this.cacheCanvas = document.createElement("canvas");}
        this._cacheWidth = width;
        this._cacheHeight = height;
        this._cacheOffsetX = x;
        this._cacheOffsetY = y;
        this._cacheScale = scale;
        this.updateCache();
    }

    p.updateCache = function(compositeOperation) {
        var cacheCanvas = this.cacheCanvas, scale = this._cacheScale, offX = this._cacheOffsetX*scale, offY = this._cacheOffsetY*scale;
        var w = this._cacheWidth, h = this._cacheHeight, fBounds;
        if (!cacheCanvas) return;
        var ctx = cacheCanvas.getContext("2d");
        
        w = Math.ceil(w*scale);
        h = Math.ceil(h*scale);
        if (w != cacheCanvas.width || h != cacheCanvas.height) {
            cacheCanvas.width = w;
            cacheCanvas.height = h;
        } else if (!compositeOperation) {
            ctx.clearRect(0, 0, w+1, h+1);
        }
        
        ctx.save();
        ctx.globalCompositeOperation = compositeOperation;
        ctx.setTransform(scale, 0, 0, scale, -offX, -offY);
        this.draw(ctx, true);
        this._applyFilters();
        ctx.restore();
    };

    p.drawFromCache = function(ctx) {
        var cacheCanvas = this.cacheCanvas;
        if (!cacheCanvas) { return false; }
        var scale = this._cacheScale, offX = this._cacheOffsetX, offY = this._cacheOffsetY, fBounds;
        if (fBounds = this._applyFilterBounds(offX, offY, 0, 0)) {
            offX = fBounds.x;
            offY = fBounds.y;
        }
        ctx.drawImage(cacheCanvas, offX, offY, cacheCanvas.width/scale, cacheCanvas.height/scale);
        return true;
    };