I have the following issue while using the com.extjs.gxt.ui.client.widget.grid.Grid widget: it seems like the performance is really low.
The grid I build has 3 columns, the cells on the first 2 having text, while the third is populated by some small colored squares.
A setInnerHTML() is called at some moment for each cell in this column and up to 200 small squares defined like below fit in each cell. There can be around 100 such rows in a grid.
So, the number of these small squares can be really big. The problem we have is that while this grid is displaying, the performance of the entire application is really slow.Code:<a title="" href="" target="_blank" class="color-969696 x-color-mbox1"><em><span style="background:#969696" unselectable="on"> </span></em></a>
I imagine this can be caused by the browser repainting the content of the grid? On Firefox the performance is much lower than in IE.
Of course, if we reduce the number of such squares to just a few 1000s, the performance improves proportionally.
Are there any tweaks we can try in order to improve this?
Is there a way to make the content of the grid repainting only is some conditions? Or have it repaint only the visible parts?