Requesting the offsetHeight of an element does everything nicely. You can force a reflow using this function and passing it the element that styles have been changed on: function reflow(elt){ console.log(elt.offsetHeight); } And call this where reflows are needed. See this example: http://jsfiddle.net/9WX5b/2/ EDIT: recently needed to do this, and wondered if there was a … Read more
This posting seems to cover the reflow vs repaint performance issues http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/ As for definitions, from that post: A repaint occurs when changes are made to an elements skin that changes visibly, but do not affect its layout. Examples of this include outline, visibility, background, or color. According to Opera, repaint is expensive because the … Read more
A reflow computes the layout of the page. A reflow on an element recomputes the dimensions and position of the element, and it also triggers further reflows on that element’s children, ancestors and elements that appear after it in the DOM. Then it calls a final repaint. Reflowing is very expensive, but unfortunately it can … Read more
Both articles are correct. One can safely assume that whenever you’re doing something that could reasonably require the dimensions of elements in the DOM be calculated that you will trigger reflow. In addition, as far as I can tell, both articles say the same thing. The first article says reflow happens when: When you retrieve … Read more