When does reflow happen in a DOM environment?

user_26349 0
Viewed 28064

What kinds of activities will trigger reflow of web page with DOM?

It seems there are different points of view. According to http://www.nczonline.net/blog/2009/02/03/speed-up-your-javascript-part-4/, it happens

  • When you add or remove a DOM node.
  • When you apply a style dynamically (such as element.style.width="10px").
  • When you retrieve a measurement that must be calculated, such as accessing offsetWidth, clientHeight, or any computed CSS value (via getComputedStyle() in DOM-compliant browsers or currentStyle in IE).

However, according to http://dev.opera.com/articles/view/efficient-javascript/?page=3, taking measurement triggers reflow only when there is already reflow action queued.

Does anybody have any more ideas?

reflow dom javascript performance
3 Answers
document.body.style.display = 'none';
document.body.style.display = 'block';

This often solves those incomprehensible layout bugs.

Vatos_63880
Related