You can get the simple description of style invalidation from the Overview section of the CSS Style Invalidation in Blink document
Invalidation is the process of marking which elements need their style recalculated in response to a change in the DOM.
Style Invalidation and Style Recalculation is separated process, and the difference was described in the invalidation sets design doc as below.
In the code, there are two passes over the DOM tree which are named Style Invalidation and Style Recalculation. Style Invalidation is the process of applying descendant invalidation sets scheduled for elements down the elements’ subtree and mark elements for Style Recalculation. Style Recalculation then traverses the DOM tree and calculates the computed style (RenderStyle objects) for the marked elements.
In short,
Style Invalidationis a process to invalidate style of possible subject elements in response to a changeStyle Recalculationis a process to compute styles for those style invalid elements
As the style invalidation document pointed, the simplest possible approach is to invalidate everything in response to every change.
When we have a style .a .b { ... } and a a class is added or removed to an element in a DOM tree, the simplest possible approach to handle the change is to get the subject elements from the DOM tree by matching the selector .a .b to every elements and apply the style to the subject elements.
Instead of invalidating entire tree, the document introduces an invalidation sets approach.
Invalidation sets give us a way to find a smaller set of elements which need recalculation. They are not perfect, they err on the side of correctness, so we invalidate elements that do not need recalculation but this are significantly better than recalculating everything.
The steps can be conceptually described as below. (For the details, please refer the documents - Invalidation sets design doc, Sibling invalidation design doc )
Builds invalidation sets by extracting features from selectors in style rules
WIP: Need some descriptions
Turning DOM changes into invalidations with the invalidation sets
WIP: Need some descriptions
