bi-07 step 01 — Predict invalidate:, then grep

Goal

Measure your CSS performance intuition against the tree's own declarations. Most engineers who consider themselves strong here get 3–4 of 10 wrong.

Tasks

  1. List the ten CSS properties you use most. For each, predict its invalidate: value: ["layout","paint"], ["paint"], ["layout"], ["compositing"], or something narrower.
  2. Grep core/css/css_properties.json5 for each and score yourself.
  3. Pay particular attention to any property where you predicted ["paint"] and the answer includes "layout". Those are the ones costing you frames today.
  4. Count the distribution across the whole file. Confirm the shape: ~95 ["layout","paint"], ~50 ["paint"], ~34 ["layout"], ~4 ["compositing"].
  5. Find a property declaring "ax-style". Explain what its presence says about where the accessibility tree lives in the pipeline.

Done when

  • 10 predictions scored; error rate recorded
  • Distribution counted independently
  • You can answer "does this property cause layout?" for any property in under a minute