CSS-компрессор (расширенный)

• Мгновенное расширенное сжатие CSS: сжимайте CSS с помощью многопроходной расширенной оптимизации за миллисекунды. Наш компрессор CSS (расширенный) полностью работает в вашем браузере — без ожидания загрузки, без передачи данных по серверу, с нулевой задержкой.
• Безопасный компрессор CSS (расширенный) онлайн: ваш CSS никогда не покидает ваше устройство, когда вы его сжимаете. 100% обработка на стороне клиента означает полную конфиденциальность — никакого облачного хранения, никаких журналов сервера и никакого раскрытия данных.
• CSS Compressor (Дополнительно) — без установки: сжимайте CSS с расширенной оптимизацией прямо в браузере. Никакой загрузки программного обеспечения, никаких плагинов и учетной записи не требуется. Работает в любом современном браузере в любой операционной системе.
• Механизм четырехпроходной оптимизации: выходит за рамки простого удаления пробелов — объединяет повторяющиеся селекторы, удаляет избыточные префиксы поставщиков, сжимает длинные обозначения полей/отступов/радиусов границ в сокращенные и показывает разбивку для каждого прохода.

• Оптимизация веб-производительности рабочей среды: сжимайте таблицы стилей CSS перед развертыванием в рабочей среде, чтобы сократить время загрузки страниц и улучшить показатели Core Web Vitals. Расширенное сжатие CSS обычно позволяет уменьшить размер реальных таблиц стилей на 30–60%.
• Очистка библиотеки React и компонентов: сжатие CSS, созданного библиотеками компонентов или системами проектирования, которые накапливают повторяющиеся селекторы в нескольких файлах компонентов. Объедините повторяющиеся правила и удалите избыточные префиксы поставщиков за один проход.
• Оптимизация тем WordPress и CMS: сжатие таблиц стилей тем WordPress, которые часто содержат повторяющиеся селекторы из переопределений дочерних тем и дополнений плагинов. Расширенное сжатие CSS объединяет эти дубликаты, не нарушая каскадный порядок.
• Оптимизация CSS для мобильных устройств: сжимайте файлы CSS для мобильных веб-приложений, где пропускная способность имеет решающее значение. Удаление префиксов поставщиков для свойств, которые теперь поддерживаются повсеместно (флексбоксы, преобразования, переходы), может сэкономить сотни байт на файл.
• Сжатие токенов дизайна и служебного CSS: сжимайте CSS, экспортированный из инструментов дизайна, таких как Figma или Tailwind, которые часто содержат подробные свойства, написанные вручную. Свертывание полей, отступов и радиуса границы в сокращенные обозначения значительно уменьшает размер файла.
• Улучшение оценки PageSpeed ​​и Lighthouse: устранены предупреждения «Уменьшить неиспользуемый CSS» и «Минимизировать CSS» в аудитах Google PageSpeed ​​Insights и Lighthouse. Расширенное сжатие CSS удаляет все пробелы, комментарии и избыточные объявления одним щелчком мыши.

Расширенное сжатие CSS выходит за рамки простого удаления пробелов и комментариев и применяет структурную оптимизацию, которая уменьшает размер файла CSS на уровне правил и объявлений. Наш компрессор CSS (расширенный) выполняет четыре прохода по вашей таблице стилей: сначала удаляет пробелы, комментарии и лишние точки с запятой; затем объединение повторяющихся селекторов, которые появляются в файле несколько раз; затем удаление свойств с префиксом поставщика, где также присутствует стандартная версия без префикса; и, наконец, свертывание свойств в сокращенном виде (например, поля-верх/справа/снизу/слева) в их сокращенные эквиваленты (поля). Вся обработка происходит полностью в вашем браузере — без сервера, без загрузки, полная конфиденциальность.

1. 1. Вставьте или загрузите свой CSS. Введите любой CSS на панели ввода или загрузите файл CSS. Инструмент принимает любой допустимый CSS, включая медиа-запросы, ключевые кадры и пользовательские свойства.
2. 2 Мгновенное многопроходное сжатие на основе браузера. Нажмите «Сжать CSS». Четыре этапа оптимизации выполняются локально в вашем браузере — данные не отправляются ни на один сервер. Панель статистики показывает, сколько именно оптимизаций было применено за каждый проход.
3. 3 Скопируйте или загрузите сжатый CSS. Скопируйте выходные данные в буфер обмена или загрузите их в виде файла .css. На выходе получается действительный, готовый к использованию CSS, который можно использовать непосредственно в любом веб-проекте.

• Пробелы и комментарии: все пробелы между токенами сворачиваются, комментарии удаляются, лишние точки с запятой перед закрывающими скобками удаляются, а нулевые значения теряют свои единицы измерения (0px → 0).
• Объединение повторяющихся селекторов: когда один и тот же селектор появляется несколько раз, все его объявления объединяются в одно правило — более поздние объявления выигрывают (с сохранением каскадного порядка). Пустые правила после слияния удаляются.
• Удаление префикса поставщика: свойства с префиксом поставщика (-webkit-, -moz-, -ms-, -o-) удаляются, когда в том же правиле также присутствует стандартное свойство без префикса, охватывающее флексбокс, преобразования, переходы, анимации, радиус границы и многое другое.
• Свертывание сокращений: когда присутствуют все четыре варианта поля, отступа, радиуса границы, ширины границы или цвета границы, они сворачиваются в сокращение с оптимальным повторением значений (например, 16 пикселей, 16 пикселей, 16 пикселей, 16 пикселей → 16 пикселей).

Усовершенствованный компрессор CSS использует структурный анализатор, а не полный анализатор спецификаций CSS. Он корректно обрабатывает стандартные наборы правил и at-правила, но сложные вложенные CSS (уровень вложенности CSS 3), синтаксис SCSS/Less и объявления пользовательских свойств CSS с var() в сокращенных значениях сохраняются дословно без сокращения сокращений. Удаление префикса поставщика применяется только в том случае, если в том же правиле присутствует точное свойство без префикса — оно никогда не удаляет свойство с префиксом, не имеющее аналога без префикса. Всегда проверяйте сжатый вывод в целевых браузерах перед развертыванием в рабочей среде.