CSS Optimization

CSS optimization has high upside, but it is often the section most likely to affect layout.

Common options may include:

Critical CSS

Critical CSS helps display above-the-fold content faster.

If it works well, pages may feel faster because the first visible layout appears sooner.

If it fails, you may see:

If the site looks broken after enabling it, turn it off first and retest.

This can improve how styles are delivered, but some themes are sensitive to stylesheet order.

If CSS appears incomplete:

This tries to reduce CSS that blocks initial paint.

It can help performance, but test carefully on:

Usually lower risk than stronger CSS features, but still verify:

This is one of the settings most likely to create compatibility issues.

Avoid turning it on first.

Test it only after the rest of the site is stable.

If layout problems appear, disable it immediately and clear all caches.

This can help on media-heavy pages, but it may affect:

If important above-the-fold imagery appears late, exclude it from lazy behavior if your build supports exclusions, or disable this setting.

Use this when:

This option usually makes sense for a small number of important backgrounds, not every background image on the site.

Some themes use preloaders, splash screens, or custom loading overlays.

If a preloader gets stuck:

Only add selectors you understand. Guessing random selectors can make debugging harder.

JS Optimization

Recommended Compression Setup