Memory leak on a Clear / Redraw

Baart commented 10 years ago

It seems that the clear method leave some orphan object.

To reproduce, use this modified demo.html file:

<html>
<head>
  <meta http-equiv="cache-control" content="max-age=0" />
  <meta http-equiv="cache-control" content="no-cache" />
  <meta http-equiv="expires" content="0" />
  <meta http-equiv="pragma" content="no-cache" />
</head>
<body>
  <div id="diagram">
  </div>

  <script src="lib/require/require.js"></script>

  <script src="lib/jquery/jquery-1.7.2.min.js"></script>
  <script src="build/bpmn.min.js"></script>

  <script>
    require({
      baseUrl: "./",
      paths: {
        'jquery' : 'lib/jquery/jquery-1.7.2.min',
        'bpmn/Bpmn' : 'build/bpmn.min',
      },
      packages: [
        { name: "dojo", location: "lib/dojo/dojo" },
        { name: "dojox", location: "lib/dojo/dojox"},
        // provided by build/bpmn.min.js
        // { name: "bpmn", location: "src/bpmn" }
      ]
    });

    require(["bpmn/Bpmn", "dojo/domReady!"], function(Bpmn) {
      var bpm = new Bpmn();

      // Cycle function to render and clean 
      function cycle() {
        bpm.renderUrl("test/resources/complex.bpmn", {
          diagramElement : "diagram",
        }).then(function (bpmn){
          setTimeout(function() { // When diagram ready, clear it in 10 ms
            bpm.clear();
            cycle();
          }, 10);
        });
      }
      cycle();

    });
  </script>
</body>
</html>

This will draw and clear massively.

On a 3 minutes run with firefox 28:

Elapsed	Memory
0s	273 M
30s	455 M
60s	550 M
90s	691 M
120s	840 M
150s	945 M
180s	1026 M

Issue can be watched on chrome by taking Heap snapshots. Some Gfx object seems to stack indefinitly.

Is this an issue or do I misunderstand the clear method ?

Best regards

meyerdan commented 10 years ago

Sorry, closed it by accident. :)

The clear() method does not seem to clean up properly, indeed. Do you know which Gfx object is preventing garbage collection?

An other approach would be to not reuse the Bpmn object instance but instead make sure it is dereferenced and garbage collected. Maye this in combination with throwing away the generated SVN from the Dom would be an other approach to try out?

Regards, Daniel

Baart commented 10 years ago

I tryed to not reuse the Bpmn object, does not change the behaviour.

svg elements are effectively removed from the DOM but they are still referenced by some javascript piece.

Seeing the heap status :

screenshot081

It seems that svg is referenced by a Dojo element which is never deleted, however, I cannot find where the problem is.

nikku commented 10 years ago

@Baart thanks for reporting this. I was able to track down some issues. No more memory leaking for the moment.

Baart commented 10 years ago

@Nikku Ok thanks for the fix.

camunda / camunda-bpmn.js

Memory leak on a Clear / Redraw #8