jQuery Grid Plugin - jqGridForum

Topic RSS

Fix Memory Leaks in emptyRows Function

12/03/2010
15:50

Klaus

Member

Members

Forum Posts: 68

Member Since:
18/11/2009

Offline

Hello,

I've detected a possible memory leak (with innerHTML=""). The following solution fixed it (for me)...

Modified: jquery.jqGrid.js

emptyRows = function (parent, scroll) {

var tBody = $("tbody:first", parent);

if(!ts.p.gridview || ts.p.jqgdnd) $("*",tBody).children().unbind();

- if(isMSIE) $.jgrid.empty.apply(tBody[0]);

- else tBody[0].innerHTML="";

+ // fix to get embedded widgets destroyed

+ $('tr', tBody[0]).remove();

I also tried the jQuery-empty()-function, but this did not destroy embedded widgets (as tooltips bound to table rows) so I used the jQuery-remove()-function.

13/03/2010
20:09

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello Klaus,

will be happy if you post a test case.

Also in which browser is this?

The main purpose of emptyRows is exactley not to use jQuery remove or empty.

The reason for this is that these work very slow in grid with rows >= 200.

The last line of code in this function should do the magic

tBody = null;

This line should release all the memory

Best Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

15/03/2010
10:30

Klaus

Member

Members

Forum Posts: 68

Member Since:
18/11/2009

Offline

Hello Tony,

The memory leaks seemed to be across several browsers (IE, Firefox).

I hope you didn't misunderstand - not the jqGrid itself has a memory leak - but any jQuery widget attached to the grid will not be destroyed correctly but keeps somewhere in memory.

The only solution (I found) to destroy those attached widgets (e.g. context menues or special tooltips on cells or rows) was by calling the jQuery remove method.

here is the code how I create my context menu widgets:

// attach context menues on all grid rows
var gridCompleteFunction = function() {
$("tr.jqgrow", "#my_table").contextMenu({menu: "tableMenu"}, ...);
...
}

// create and open context menue directly on right click cell on grid
var onRightClickCellFunction = function(rowid, iRow, iCol, event) {
var cellElem = event.target;
$(cellElem).contextMenu({menu: "tableMenu2"}, ..., "doOpenDirectly");
}

The other possiblity would be to have an event when a row (or a set of rows) is removed from the table with the row objects given as parameter.

Or maybe you could provide a global option to decide which cleaup routine is taken in the emptyRows function (the "fast" or the "destructive" way Wink )

Kind regards,
Klaus.

18/03/2010
11:02

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello Klaus,

I understand, since this is connected with the grid.

Could you please try this. Lieve the emptyRows as of its original variant and just remove the

if(!ts.p.gridview || ts.p.jqgdnd) – i.e the final code should be:

        emptyRows = function (parent, scroll) {
           var tBody = $("tbody:first", parent);
            $("*",tBody).children().unbind();
           if(isMSIE) $.jgrid.empty.apply(tBody[0]);
           else tBody[0].innerHTML="";
           if (scroll && ts.p.scroll) {
               $(">div:first", parent).css({height:"auto"}).children("div:first").css({height:0,display:"none"});
               parent.scrollTop = 0;
           }
           tBody = null;
       },

If you test it this way, please let me know if this resolve the problem

Thanks

Best Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

18/03/2010
15:51

Klaus

Member

Members

Forum Posts: 68

Member Since:
18/11/2009

Offline

Hello Tony,

No, your suggestion did not help with my problem. The mentioned statement (

$("*",tBody).children().unbind();

) will only unbind all events but will not clean up the following ...

any created jQuery / jQuery UI widgets
DOM elements and JavaScript objects (created manually or within a jQuery UI widget)

For example when I attach jQuery Tooltips on cells in the table, they create some JS objects and some DOM elements (DIVs) directly on the body.

So the only solution to remove those objects was using the remove method which will then invoke the widget's destroy method.

Kind regards,
Klaus.

22/03/2010
11:02

tony

Sofia, Bulgaria

Moderator

Members

Moderators

Forum Posts: 7721

Member Since:
30/10/2007

Offline

Hello Klaus,

Yes you are right on this.

Will see what I can do for this. Thanks.

Best Regards

Tony

For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.

All RSS

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
45 Guest(s)

Currently Browsing this Page:
1 Guest(s)