2. ● Repaint ( redraw )
Elements skin changes visibility , but do not affect it's
layout
e.g. outline , border
● Reflow
Affect the layout of a portion of the page
e.g. position , display
Repaints and reflows can be expensive, they can hurt
the user experience, and make the UI appear sluggish.
What is the different ?
4. ● Change Visibility : hidden to visible
● Change background , border-color , color
● Elements skin changes visibility , but do not affect it's
layout
6. ● Resizing the window
● Changing the font
● Adding or removing a stylesheet
● Content changes, such as a user typing text in an
input box
● Activation of CSS pseudo classes such as :hover (in
IE the activation of the pseudo class of a sibling)
● Manipulating the class attribute
● A script manipulating the DOM
● Calculating offsetWidth and offsetHeight
● Setting a property of the style attribute