URL: /rules/perf/cls-hints

---
title: "CLS Optimization Hints"
description: "Checks for Cumulative Layout Shift prevention"
---

Checks for Cumulative Layout Shift prevention

| | |
|---|---|
| **Rule ID** | `perf/cls-hints` |
| **Category** | [Performance](/rules/perf) |
| **Scope** | Per-page |
| **Severity** | warning |
| **Weight** | 6/10 |

## Solution

CLS measures visual stability - how much content shifts during load. Prevent layout shifts by: 1) Always set width and height attributes on images and iframes. 2) Reserve space for ads and embeds with CSS min-height. 3) Use CSS aspect-ratio for responsive media. 4) Avoid inserting content above existing content. 5) Use transform animations instead of properties that trigger layout.

## Enable / Disable

### Disable this rule

```toml squirrel.toml
[rules]
disable = ["perf/cls-hints"]
```

### Disable all Performance rules

```toml squirrel.toml
[rules]
disable = ["perf/*"]
```

### Enable only this rule

```toml squirrel.toml
[rules]
enable = ["perf/cls-hints"]
disable = ["*"]
```
