Merge pull request #421 from henri-astre-msft/memory_leak

Fix memory leak while destroying the viewer.
This commit is contained in:
iangilman 2014-06-19 09:12:34 -07:00
commit 7ccacad70f
5 changed files with 105 additions and 2 deletions

View File

@ -302,6 +302,22 @@ $.Drawer.prototype = /** @lends OpenSeadragon.Drawer.prototype */{
*/ */
canRotate: function() { canRotate: function() {
return this.useCanvas; return this.useCanvas;
},
/**
* Destroy the drawer (unload current loaded tiles)
* @method
* @return null
*/
destroy: function() {
//unload current loaded tiles (=empty TILE_CACHE)
for ( var i = 0; i < this.tilesLoaded.length; ++i ) {
this.tilesLoaded[i].unload();
}
//force unloading of current canvas (1x1 will be gc later, trick not necessarily needed)
this.canvas.width = 1;
this.canvas.height = 1;
} }
}; };

View File

@ -252,6 +252,9 @@
destroy: function () { destroy: function () {
stopTracking( this ); stopTracking( this );
this.element = null; this.element = null;
THIS[ this.hash ] = null;
delete THIS[ this.hash ];
}, },
/** /**

View File

@ -529,6 +529,12 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
* @fires OpenSeadragon.Viewer.event:close * @fires OpenSeadragon.Viewer.event:close
*/ */
close: function ( ) { close: function ( ) {
if ( !THIS[ this.hash ] ) {
//this viewer has already been destroyed: returning immediately
return this;
}
if ( this._updateRequestId !== null ) { if ( this._updateRequestId !== null ) {
$.cancelAnimationFrame( this._updateRequestId ); $.cancelAnimationFrame( this._updateRequestId );
this._updateRequestId = null; this._updateRequestId = null;
@ -542,6 +548,10 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
this.drawersContainer.innerHTML = ""; this.drawersContainer.innerHTML = "";
this.overlaysContainer.innerHTML = ""; this.overlaysContainer.innerHTML = "";
if ( this.drawer ) {
this.drawer.destroy();
}
this.source = null; this.source = null;
this.drawer = null; this.drawer = null;
this.drawers = []; this.drawers = [];
@ -568,13 +578,26 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
/** /**
* Function to destroy the viewer and clean up everything created by * Function to destroy the viewer and clean up everything created by OpenSeadragon.
* OpenSeadragon. *
* Example:
* var viewer = OpenSeadragon({
* [...]
* });
*
* //when you are done with the viewer:
* viewer.destroy();
* viewer = null; //important
*
* @function * @function
*/ */
destroy: function( ) { destroy: function( ) {
this.close(); this.close();
//TODO: implement this...
//this.unbindSequenceControls()
//this.unbindStandardControls()
this.removeAllHandlers(); this.removeAllHandlers();
// Go through top element (passed to us) and remove all children // Go through top element (passed to us) and remove all children
@ -597,6 +620,9 @@ $.extend( $.Viewer.prototype, $.EventSource.prototype, $.ControlDock.prototype,
this.outerTracker.destroy(); this.outerTracker.destroy();
} }
THIS[ this.hash ] = null;
delete THIS[ this.hash ];
// clear all our references to dom objects // clear all our references to dom objects
this.canvas = null; this.canvas = null;
this.keyboardCommandArea = null; this.keyboardCommandArea = null;

View File

@ -295,6 +295,7 @@
equal(null, viewer.container); equal(null, viewer.container);
equal(null, viewer.element); equal(null, viewer.element);
equal(true, closeCalled); equal(true, closeCalled);
viewer = null;
start(); start();
}); });
viewer.open('/test/data/testpattern.dzi'); viewer.open('/test/data/testpattern.dzi');

View File

@ -0,0 +1,57 @@
<!DOCTYPE html>
<html>
<head>
<title>OpenSeadragon Memory Check Demo</title>
<script type="text/javascript" src='../../build/openseadragon/openseadragon.js'></script>
<style type="text/css">
.openseadragon1 {
width: 800px;
height: 600px;
}
</style>
</head>
<body>
<div>
Simple demo page to monitor OpenSeadragon Memory Usage.
</div>
<button onclick="createViewer()">Create</button>
<button onclick="destroyViewer()">Destroy</button>
<div id="contentDiv" class="openseadragon1"></div>
<script type="text/javascript">
var _viewer;
var generateUniqueHash = (function() {
var counter = 0;
return function() {
return "openseadragon_" + (counter++);
};
})();
function createViewer() {
if ( _viewer ) {
destroyViewer();
}
_viewer = OpenSeadragon({
element: document.getElementById("contentDiv"),
showNavigationControl: false,
prefixUrl: "../../build/openseadragon/images/",
hash: generateUniqueHash(), //this is only needed if you want to instantiate more than one viewer at a time.
tileSources: "../data/testpattern.dzi"
});
}
function destroyViewer() {
if ( _viewer ) {
_viewer.destroy();
}
_viewer = null;
}
</script>
</body>
</html>