Opened 9 years ago

Closed 9 years ago

#11895 closed defect (invalid)

Performance issue for loading a TabContainer(with several DataGrids as it's children widgets) on IE8

Reported by: gbroad Owned by: Bryan Forbes
Priority: blocker Milestone: 1.6
Component: DojoX Grid Version: 1.5
Keywords: Cc: Nathan Toone, Jared Jurkiewicz, Bryan Forbes, robwaite
Blocked By: Blocking:

Description

After some investigation on this issue, I found the root cause should be:

After a domnode is set a class named "dijitHidden"(display:none), offsetHeight, offsetWidth, offsetLeft, offsetTop,clientHeight and clientWidth of the domnode are set to 0 on FireFox?, but on IE8, only offsetHeifht and offsetWidth are set to 0.

In the loading process, after the first grid is created and showed, each hidden grid will be created, the scroller of hidden datagrid is calculating first, the scroller's height is set as the clientHeight of that datagrid. In fact, datagrid is in hidden status, the scroller's height should be 0. But on IE8, this datagrid's clientHeight has a positive value. So, all the pages of datagrid will be calculated to adapt with the scroller.

I have a solution to fix this performance issue, the code change is in the adaptHeight function of dojox/grid/_Grid.js:

adaptHeight: function(inHeaderHeight){

private: measures and normalizes header height, then sets view heights, and then updates scroller content extent var t = inHeaderHeight === undefined ? this._getHeaderHeight() : inHeaderHeight;

var h = (this._autoHeight ? -1 : Math.max(this.domNode.clientHeight - t, 0)
0);

-->performance enhancement on IE8, loading tabcontainer with several datagrids if(dojo.isIE && this.domNode.offsetHeight == 0 && this.domNode.clientHeight >0)

h = 0;

<--performance enhancement on IE8, loading tabcontainer with several datagrids

this.views.onEach('setSize', [0, h]); this.views.onEach('adaptHeight'); if(!this._autoHeight){

var numScroll = 0, numNoScroll = 0; var noScrolls = dojo.filter(this.views.views, function(v){

var has = v.hasHScrollbar(); if(has){ numScroll++; }else{ numNoScroll++; } return (!has);

}); if(numScroll > 0 && numNoScroll > 0){

dojo.forEach(noScrolls, function(v){

v.adaptHeight(true);

});

}

}

if(this.autoHeight === true
h != -1 (typeof this.autoHeight == "number" && this.autoHeight >= this.attr('rowCount'))){

this.scroller.windowHeight = h;

}else{

this.scroller.windowHeight = Math.max(this.domNode.clientHeight - t, 0);

}

},

Could anyone give some suggestion? Thanks!

Attachments (1)

11895.html (2.9 KB) - added by evan 9 years ago.
A test case that put multiple EDG within TabContainer?

Download all attachments as: .zip

Change History (5)

comment:1 Changed 9 years ago by gbroad

Code change:

-->performance enhancement on IE8, loading tabcontainer with several datagrids if(dojo.isIE && this.domNode.offsetHeight == 0 && this.domNode.clientHeight >0)

h = 0;

<--performance enhancement on IE8, loading tabcontainer with several datagrids

comment:2 Changed 9 years ago by gbroad

Code Change: -->performance enhancement on IE8, loading tabcontainer with several datagrids:
if(dojo.isIE && this.domNode.offsetHeight == 0 && this.domNode.clientHeight >0)
h = 0;
<--performance enhancement on IE8, loading tabcontainer with several datagrids

comment:3 Changed 9 years ago by bill

Owner: changed from bryanforbes to Bryan Forbes

comment:4 Changed 9 years ago by evan

Milestone: tbd1.6
Resolution: invalid
Status: newclosed

Didn't reproduce the mentioned issue(tested with WinXP/Win7 + IE8) - with the attached test case(#11895.html) that put multiple EDG(also tried DataGrid?) in TabContainer?.

The suggested fix code was never executed during the test:
if(dojo.isIE && this.domNode.offsetHeight == 0 && this.domNode.clientHeight >0){h = 0;}

Closing this unless we got more tips/test cases to reproduce.

Changed 9 years ago by evan

Attachment: 11895.html added

A test case that put multiple EDG within TabContainer?

Note: See TracTickets for help on using tickets.