Что делает минификатор
Убирает комментарии, лишние пробелы, переносы строк и пустые строки — то, что нужно человеку для чтения кода, но не нужно браузеру. CSS и HTML сжимаются в одну строку, JS — только по комментариям и отступам (переносы строк между инструкциями сохраняются, подробнее — ниже).
Почему JS сжимается не так агрессивно, как CSS и HTML
У JavaScript есть автоматическая расстановка точек с запятой (ASI): если убрать перенос строки не в том месте, код может начать работать иначе или вовсе сломаться. Минификатор убирает переносы только там, где это доказуемо безопасно — внутри скобок и массивов, сразу после {, (, ;, ,, перед }, ), ], в цепочках вызовов через точку. Там, где перенос может повлиять на смысл (после return, между двумя независимыми выражениями без точки с запятой), он остаётся на месте. Не переименовывает переменные и не удаляет неиспользуемый код — это безопасный компромисс, а не полноценный сборщик уровня Terser или esbuild.
Что не сломается
Минификатор различает код и содержимое строк, шаблонных литералов и регулярных выражений — текст внутри них (в том числе похожий на комментарии или фигурные скобки) не трогается. В CSS отдельно защищены значения url(...), включая base64-картинки, и намеренно не убирается пробел перед :hover и другими псевдоклассами — это может быть частью селектора (.a :hover — это не то же самое, что .a:hover). В HTML содержимое <pre> и <textarea> копируется как есть, а инлайновые <style> и <script> дополнительно сжимаются теми же алгоритмами, что CSS и JS по отдельности.
Как определяется тип кода
Минификатор смотрит на характерные признаки: теги вроде <div> или <!DOCTYPE> — это HTML; правила с фигурными скобками и точкой с запятой после свойства (color: red;), @media и переменные --название — это CSS; ключевые слова вроде function, const, return — JS. Если в поле есть готовый код (не пара символов), тип определяется верно практически всегда.
Сжатие CSS, JS и HTML онлайн — бесплатно
Инструмент нужен перед тем, как выложить код на боевой сайт: меньше байт — быстрее загрузка страницы. Подходит для инлайновых стилей и скриптов, небольших файлов и фрагментов кода, которые не проходят через сборщик. Ничего никуда не отправляется — всё считается в браузере.