CSS Aggregation

CSS aggregation bundles multiple files so they can be downloaded more efficiently.

Enable it at Configuration > Development > Performance.

Aggregated files will have hashed names.

When a file is changed, the assets need to be regenerated by clearing the cache.

Disable aggregation for local development, see web/sites/example.settings.local.php.

How it works

Drupal creates 2 CSS bundles for the header. One contains global styles and the second is dependencies on the page.

The assets that have been sent to the user are contained in a session variable so they can be excluded from subsequent bundles.