views:

172

answers:

1

I'm a little unclear on the difference between reflow + repaint (if there's any difference at all)

Seems like reflow might be shifting the position of various DOM elements, where repaint is just rendering a new object. E.g. reflow would occur when removing an element and repaint would occur when changing its color.

Is this true?

+3  A: 

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 visibility, but do not affect its layout.

Examples of this include outline, visibility, or background color. According to Opera, repaint is expensive because the browser must verify the visibility of all other nodes in the DOM tree.

A reflow is even more critical to performance because it involves changes that affect the layout of a portion of the page (or the whole page).

DVK
Perfect, thanks!
Jon Raasch