Мініфікатор CSS

CSS minification removes all unnecessary characters from a CSS stylesheet without affecting how the page looks. This includes whitespace, line breaks, comments, and the last semicolon before a closing brace. The output is a single-line stylesheet that is functionally identical to the original but significantly smaller — typically 20–40% smaller before compression.

CSS - це ресурс, що блокує рендеринг. Браузери повинні завантажити та проаналізувати всі CSS, перш ніж вони зможуть відобразити сторінку, а це означає, що великі або немініфіковані файли CSS затримують першу змістовну фарбу (FCP) та найбільшу змістовну фарбу (LCP). Google PageSpeed Insights позначає немініфікований CSS як можливість "мінімізувати CSS", а такі інструменти, як Lighthouse, штрафують таблиці стилів, що блокують візуалізацію, під час аудиту ефективності.

Цей інструмент повністю обробляє CSS у вашому браузері за допомогою спеціального алгоритму мініфікації. Він видаляє коментарі, згортає пробіли, видаляє пробіли навколо синтаксичних символів CSS ({, }, :, ;, ,) і скидає кінцеві крапки з комою перед закриттям дужок. Функція Beautify скасовує цей процес, повторно змінюючи правила читабельності — корисно, коли ви отримуєте мініфікований CSS від третьої сторони і вам потрібно прочитати або змінити його.