Opened 11 years ago

Closed 11 years ago

Last modified 11 years ago

#9285 closed defect (fixed)

[performance] getMarginExtents usage in grid

Reported by: Adam Peller Owned by: Nathan Toone
Priority: high Milestone: 1.4
Component: DojoX Grid Version: 1.3.0
Keywords: performance Cc: Jared Jurkiewicz, Nathan Toone
Blocked By: Blocking:

Description

profiling for a large # of rows in grid turned up normalizeRowNodeHeights calling _getMarginExtents a lot. getComputedStyle is very expensive. Perhaps these values can be cached, at least for the duration of the layout?

_getMarginExtents()    1982    31.06%    4828.125ms    4875ms    2.46ms    0ms    281.25ms    dojo/./_...e/html.js (line 711)
normalizeRowNodeHeights()    497    15.18%    2359.375ms    7718.75ms    15.531ms    0ms    296.875ms    dojo/../...anager.js (line 74)
createRowNode()    990    15.08%    2343.75ms    2359.375ms    2.383ms    0ms    2000ms    dojo/../.../_View.js (line 438)
_getText()    85    6.33%    984.375ms    1015.625ms    11.949ms    0ms    15.625ms    hostenv_...rowser.js (line 224)
_getPadExtents()    4    4.12%    640.625ms    640.625ms    160.156ms    0ms    328.125ms    dojo/./_...e/html.js (line 637)
adaptWidth()    3    3.72%    578.125ms    578.125ms    192.708ms    0ms    296.875ms    dojo/../.../_View.js (line 392)
style()    15    3.62%    562.5ms    562.5ms    37.5ms    0ms    281.25ms    dojo/./_...e/html.js (line 551)
renderRow()    495    2.71%    421.875ms    11187.5ms    22.601ms    0ms    2000ms    dojo/../...anager.js (line 229)
_getItemsFromLoadedData()    1    2.41%    375ms    625ms    625ms    625ms    625ms    dojo/./d...dStore.js (line 413)
hasVScrollbar()    9    1.41%    218.75ms    781.25ms    86.806ms    0ms    281.25ms    dojo/../.../_View.js (line 336)
arrange()    3    1.41%    218.75ms    218.75ms    72.917ms    0ms    109.375ms    dojo/../...anager.js (line 164)
buildRowContent()    494    1.31%    203.125ms    312.5ms    0.633ms    0ms    15.625ms    dojo/../.../_View.js (line 452)
addItemAndSubItemsToArrayOfAllItems    3000    1.21%    187.5ms    234.375ms    0.078ms    0ms    15.625ms    dojo/./d...dStore.js (line 456)
_getMarginBox()    991    1.11%    171.875ms    3609.375ms    3.642ms    0ms    281.25ms    dojo/./_...e/html.js (line 761)
gcs()    2993    1.11%    171.875ms    171.875ms    0.057ms    0ms    15.625ms    dojo/./_...e/html.js (line 386)
buildRowContent()    495    0.8%    125ms    125ms    0.253ms    0ms    15.625ms    dojo/../...lector.js (line 19)
(?)()    82    0.6%    93.75ms    2390.625ms    29.154ms    0ms    1281.25ms    bootstrap.js (line 403)
generateHtml()    494    0.6%    93.75ms    109.375ms    0.221ms    0ms    15.625ms    dojo/../...uilder.js (line 222)
_mixin()    3387    0.5%    78.125ms    78.125ms    0.023ms    0ms    15.625ms    bootstrap.js (line 230)
_setBox()

Attachments (3)

grid.html (4.2 KB) - added by Jared Jurkiewicz 11 years ago.
Testcase that generated that profile from firebug.
grid.2.html (4.2 KB) - added by Nathan Toone 11 years ago.
Modified test case which gets me approximately these numbers
Picture 1.png (87.7 KB) - added by Nathan Toone 11 years ago.

Download all attachments as: .zip

Change History (9)

comment:1 Changed 11 years ago by Adam Peller

note to self... need to attach example that generated this data

Changed 11 years ago by Jared Jurkiewicz

Attachment: grid.html added

Testcase that generated that profile from firebug.

comment:2 Changed 11 years ago by Nathan Toone

Cc: Nathan Toone added; nathan removed

comment:3 Changed 11 years ago by Nathan Toone

Owner: changed from Bryan Forbes to Nathan Toone

I'll take this one...though isn't 3000 rows per page a bit extreme? That's the entire point of having the grid lazily load pages...so that you don't have to render that many rows.

(A plain HTML table with 3000 rows will take quite a while to render by itself...)

That being said - I think that I have some changes that will dramatically improve these numbers...

Changed 11 years ago by Nathan Toone

Attachment: grid.2.html added

Modified test case which gets me approximately these numbers

Changed 11 years ago by Nathan Toone

Attachment: Picture 1.png added

comment:4 Changed 11 years ago by Nathan Toone

Resolution: fixed
Status: newclosed

(In [17611]) Fixes #9285 - reduce the number of calls to getMarginBox (dramatically). Also improve grid rendering time by being a bit smarter on when we renormalize rows, etc. Improve the performance of the _RowSelector - which was a beast. !strict

comment:5 Changed 11 years ago by Adam Peller

Jared ran the "extreme" test case profile again - getMarginExtents has fallen out, but normalizeRowNodeHeights is still a hotspot

in FF2:

Function Calls Percent Own Time Time Avg Min Max File
normalizeRowNodeHeights()    1230    67.35%    17437.5ms    17500ms    14.228ms    0ms    31.25ms    dojo/../...anager.js (line 74)
_isFunction()    5540    6.04%    1562.5ms    1562.5ms    0.282ms    0ms    1562.5ms    dojo/./_...e/lang.js (line 27)
styleRow()    1234    5.97%    1546.875ms    1546.875ms    1.254ms    0ms    1546.875ms    dojo/../...anager.js (line 253)
_getText()    85    4.22%    1093.75ms    1156.25ms    13.603ms    0ms    15.625ms    hostenv_...rowser.js (line 225)
renderRow()    1228    4.22%    1093.75ms    23734.375ms    19.328ms    0ms    1609.375ms    dojo/../...anager.js (line 239)
buildRowContent()    1228    1.57%    406.25ms    937.5ms    0.763ms    0ms    93.75ms    dojo/../.../_View.js (line 565)
_getItemsFromLoadedData()    1    1.33%    343.75ms    593.75ms    593.75ms    593.75ms    593.75ms    dojo/./d...dStore.js (line 464)
buildRowContent()    1228    1.09%    281.25ms    281.25ms    0.229ms    0ms    15.625ms    dojo/../...lector.js (line 19)
generateHtml()    1228    1.03%    265.625ms    515.625ms    0.42ms    0ms    93.75ms    dojo/../...uilder.js (line 224)
addItemAndSubItemsToArrayOfAllItems    3000    0.72%    187.5ms    187.5ms    0.063ms    0ms    15.625ms    dojo/./d...dStore.js (line 508)
format()    7368    0.72%    187.5ms    250ms    0.034ms    0ms    93.75ms    dojo/../.../_base.js (line 50)
attr()    3783    0.72%    187.5ms    1828.125ms    0.483ms    0ms    1562.5ms    dojo/./_...e/html.js (line 1303)
createRowNode()    2456    0.6%    156.25ms    1984.375ms    0.808ms    0ms    1578.125ms    dojo/../.../_View.js (line 539)
getStyleText()    2456    0.54%    140.625ms    140.625ms    0.057ms    0ms    15.625ms    dojo/../.../_View.js (line 15)
_mixin()    3415    0.36%    93.75ms    93.75ms    0.027ms    0ms    15.625ms    bootstrap.js (line 234)
applyStyles()

in FF3:

normalizeRowNodeHeights()    999    58.48%    8158.708ms    8204.367ms    8.213ms    0.004ms    19.064ms    dojo/../...anager.js (line 74)
isEditRow()    1993    18.93%    2640.239ms    2648.22ms    1.329ms    0.002ms    2641.829ms    dojo/../...anager.js (line 84)
renderRow()    997    4.07%    568.135ms    12814.164ms    12.853ms    3.224ms    2642.265ms    dojo/../...anager.js (line 239)
buildRowContent()    996    1.63%    227.567ms    629.145ms    0.632ms    0.568ms    1.234ms    dojo/../.../_View.js (line 565)
_getItemsFromLoadedData()

comment:6 Changed 11 years ago by Nathan Toone

Milestone: tbd1.4
Note: See TracTickets for help on using tickets.