title: GWT FlexTable performance and optimization
body: <p>I'm working on GWT project where we are using <a href="http://google-web-toolkit.googlecode.com/svn/javadoc/latest/com/google/gwt/user/client/ui/FlexTable.html" rel="noreferrer">FlexTable</a> to display some data. I know that we should probably be using <a href="http://google-web-toolkit.googlecode.com/svn/javadoc/latest/com/google/gwt/user/cellview/client/CellTable.html" rel="noreferrer">CellTable</a> as it has better performance, but FlexTable is easier to style (style specific cells) and makes it easier to update specific cell.</p>
  
  <p>To receive updates for the table we're using WebSockets. The problem we're facing right now is high CPU load when there're more than 100 updates per second coming through WebSockets. Each message from WebSocket connection contains updates for several cells in the table. So in practice there're more than 100 updates per second that should be rendered in the FlexTable. CPU load on my 3GHz i5 with 4GB RAM is around 50%. If I disable actual rendering of the data (comment out setText() method calls) then CPU load goes down to 5-10%. So I know that DOM updates are the bottleneck, not the other parts of the code.</p>
  
  <p>Would it be better to</p>
  
  <ol>
  <li>use Grid instead</li>
  <li>switch to CellTable (but how to make singe cell updates then)?</li>
  <li>use JS/JSNI to work with DOM instead of FlexTable setText()</li>
  </ol>
  
  <p>Are there better ways to implement table and improve performance?</p>
  
  <p>I've tried to google if someone had similar problems with FlexTable, but found only the general opinion that it is just slow, nothing specific. We have application prototype done purely in JavaScript and with same 100 updates per second CPU load is around 15%</p>
  
  <p><strong>Update</strong><br>
  Dropping css fade effect which we used to indicate change in the cell value reduced CPU load by ~10%. So it seems that the DOM is not the only problem.</p>