Delayed Rendering

Interface V2.5 release adds delay drawing mechanism can improve the response time interactive zooming experience

#delayedRendering // enable delayed rendering, enabled by default

#pauseRendering = function(pause, force){} //whether to suspend or start drawing

Example of use

In the mouse wheel zoom and touch kneading zoom are enabled for delayed rendering, the following is a pinch zooming relevant code fragment when interacting, stop drawing canvas at the start of kneading event, repainted canvas kneading event is over, reducing the interaction of CPU overhead, shorten the response time interactive

Q.PanInteraction.prototype = {
...
    startpinch: function(evt, graph){
        graph.pauseRendering(true);
    },
    onpinch: function(evt, graph){
        this._start = true;
        var dScale = evt.dScale;
        if(dScale){
            var p = graph.globalToLocal(evt.center);
            graph.zoomAt(dScale, p.x, p.y, false);
        }
    },
    endpinch: function(evt, graph){
        graph.pauseRendering(false);
    }
}

Possible problems

Delay drawing mechanism can effectively shorten interactive response time, but also some code issues
Blank canvas
After opening delay drawing, the canvas at the end of the interactive refresh, which means that during the interaction will appear blank, such as blank canvases appear around narrow
Jitter canvas
When drawing canvas pause, zoom panning effect canvas all realized by CSS transform property, due to different browser support is inconsistent effects that may occur under certain version browser interface jitter problems, such as Firefox V45.0.1, this time you can choose Close canvas delay drawing attributes: graph.delayedRendering = false; to avoid problems.