Parts of the render tree (or the whole tree) will need to be revalidated and the node dimensions recalculated.
Reflow is also named layout, relayout, or layouting.
Parts of the screen will need to be updated, either because of changes in geometric properties of a node or because of stylistic change, such as changing the background color.
Repaint is also named repaint.
display: none(reflow and repaint) or
visibility: hidden(repaint only, because no geometry changes)
They batch the changes has much as they can.
But sometimes the script may prevent the browser from optimizing the reflows, and cause it to flush the queue and perform all batched changes. This happens when you request style information, such as
Because the browser has to give you the most up-to-date value.
display: nonebefore making the changes then restore the display
Explain how to optimize repaints / reflows.
Introduce fastdom lib to industrialize optimizations.