The cause of this issue is the fact that the entire table markup is updated/replaced by a newly-rendered table. The temporary misalignment and snap back is simply caused by rendering all the nodes by the browser. It only seems to happen on slow browsers like IE. If you observe carefully, when you first load the grouping and multi row header demos you can notice the same temporary misalignment in the header.

The reasons why the entire table is updated when expanding/contracting rows could be that the row expansions don't have client ids and the corresponding <tr> elements are "inserted" in the original markup. So, a possible solution to this issue could be to always render the expanded rows with a client id, with style="display:none;", and with no content inside of them. Then, when a row is actually expanded, only such <tr> element would be updated, removing the "display:none;" and adding the content inside of it, thus avoiding a full table update.

r38727:
Added tr placeholders with client ids for row/panel expansions at the first level of the table, in order to avoid full table updates when contracting/expanding rows.

Committed final fix at revision 38789. Now, all the <tr> elements corresponding to all child row levels and panel expansions are going to be rendered with their client ids and initially hidden, so that when rows are expanded/contracted only <tr> elements will be updated instead of the entire table.

Committed fix to 3.3 EE branch at revision 38825.

Re-tested showcase > Grouping with EE-3.3.0-maintenance branch rev# 39069, and no header-columns misalignments have been observed in FF25, Chrome30, IE7/8/10.

The "malformedXML code 200" console error could not be reproduced in any browser.

The "'console' is undefined" JS error and the columns misalignment have been reproduced only in FF3.6, but not in IE8/Document Mode IE8 standard.

In IE8/Document Mode IE7 Standards, and also in IE10/Document Mode IE7/IE8 Standards a JS error occurred in browser console and as a popup (not an issue in IE7):
Object doesn't support this property or method coalesced.js.jsf?ln=ice.core&dgst=zg6ihb, line 442 character 9082

JS error issue is found in IE 7 and 8, and FF 3.6. DataTable/TablePanelConfigAjax throws error upon load in these browsers with Tomcat 6 or 7.

FF:
Error: console is not defined
Source File: http://localhost:8080/dataTable/javax.faces.resource/util/ace-datatable.js.jsf?ln=icefaces.ace&v=3_3_0_131210
Line: 1

IE:
Message: 'console' is undefined
Line: 1
Char: 26389
Code: 0
URI: http://localhost:8080/dataTable/javax.faces.resource/util/ace-datatable.js.jsf?ln=icefaces.ace&v=3_3_0_131210

Testing with with EE-3.3.0.GA-maintenance rev 39472 (with updated Mojarra 2.1.26 JSF), no JS errors were found in IE7, but the same JS error were reproduced in IE8/Document Mode IE8 Standards and IE8/Document Mode IE7 Standards.

IE8/Document Mode IE8 Standards:
Message: 'console' is undefined
Line: 476
Char: 26423
Code: 0
URI: http://10.18.39.149:8080/showcase/javax.faces.resource/coalesced.js.jsf?ln=ice.core&dgst=zg6ihb

IE8/Document Mode IE7 Standards:
SCRIPT438: Object doesn't support property or method 'querySelector'
coalesced.js.jsf, line 442 character 9341

Re-tested with IF4 trunk rev# 39869 / EE-3.3.0-maintenance-branch rev# 39821 (IE10/FF26/Chrome32/IE8 w. DocMode IE7).
No misalignment issue found with either revisions.
Using IE8/Document Mode IE7, with EE-3.3.0-maintenance-branch rev# 39821, a similar JS error as from the previous comments was reproduced.

Marking this as resolved, new JIRA ICE-9829 created for the JS error in IE8/doc mode IE7.