no-expensive-positioning-patterns
Warn when position: fixed or position: sticky appears in the same rule as expensive paint effects.
What this catchesโ
- fixed overlays with
backdrop-filter - sticky headers with large
box-shadow - fixed elements with
filterorclip-path
Rule optionsโ
| Option | Default | Why |
|---|---|---|
ignoreProperties | [] | Allows deliberate fixed or sticky paint effects after review. |
positions | ["fixed", "sticky"] | Fixed and sticky layers are more likely to repaint during scroll. |
{
"css-performance-budget/no-expensive-positioning-patterns": [
true,
{
"positions": ["fixed", "sticky"],
"ignoreProperties": ["box-shadow"]
}
]
}