Как пользоваться: Минификатор JavaScript
- Вставьте свой JavaScript или откройте файл
.js. - Оставьте включенными Compress и Mangle names, чтобы получить минимальный размер; отметьте ES module для кода с
import/export. - При необходимости удалите вызовы
consoleи выберите, какие комментарии сохранить. - Скопируйте результат или скачайте его как
.min.js.
Что делает минификатор JavaScript?
Минификация уменьшает размер JavaScript без изменения его поведения. Она удаляет пробелы и комментарии, сокращает имена локальных переменных и функций и переписывает код в более короткие эквивалентные формы. Меньшие файлы быстрее загружаются и разбираются, что помогает скорости страниц и Core Web Vitals, особенно на мобильных устройствах.
Этот инструмент запускает Terser — минификатор, который лежит в основе Vite, webpack и Rollup, — прямо в вашем браузере.
Основные опции
| Опция | Что делает | Риск |
|---|---|---|
| Compress | Удаляет недостижимый код, вычисляет константы (60 * 60 → 3600), упрощает условия и объединяет инструкции | Очень низкий |
| Mangle names | Переименовывает локальные переменные и параметры в одну или две буквы | Низкий — код с eval или Function.name может сломаться |
| Mangle top-level | Также переименовывает глобальные функции и переменные | Ломает код, который вызывает их по имени из других скриптов |
| ES module | Разбирает import/export и включает строгий режим и переименование на верхнем уровне | Для настоящих модулей рисков нет |
| Remove console.* | Удаляет console.log и похожие вызовы | Удаляет логи, которые могут понадобиться в продакшене |
Минификация и сжатие
Минификация и gzip/Brotli работают вместе. Минификация обычно уменьшает файл на 30–60 %; затем gzip или Brotli на сервере сжимает оставшееся ещё на 60–70 %. Статистика выше показывает оба значения: размер после минификации и размер в gzip, который реально передаётся по сети.
Сохранение лицензионных комментариев
Лицензии с открытым кодом, например MIT, требуют, чтобы уведомление об авторских правах оставалось вместе с кодом. По соглашению такие комментарии начинаются с /*! или содержат @license, и настройка по умолчанию их сохраняет.
Решение проблем
- Синтаксическая ошибка: показываются строка и колонка. TypeScript и JSX сначала нужно скомпилировать в JavaScript.
- Код перестал работать после переименования: отключите Mangle top-level names; если это не помогло, проверьте наличие
evalили кода, который читает имена функций. - Нужна снова читаемая версия? Используйте форматировщик JavaScript, чтобы привести минифицированный код в порядок.
Также ищут как: минифицировать js онлайн, minify js, js минификатор, terser онлайн, uglify js онлайн, минификация js.
Инструменты, которые хорошо сочетаются с Минификатор JavaScript
- Минификатор HTML — Уменьшите размер HTML-страниц и шаблонов: удаляйте комментарии и лишние пробелы, минифицируйте встроенные <style> и <script>, а также упрощайте атрибуты.
- Минификатор CSS — Вставьте таблицу стилей, чтобы мгновенно уменьшить её размер.
- Минификатор JSON — Удалите лишние пробелы из JSON, одновременно проверьте его синтаксис и узнайте, на сколько байт уменьшился файл — до и после gzip.
- Тест сжатия сайта — Введите URL, чтобы увидеть, какое сжатие отдаёт ваш сервер для каждого Accept-Encoding, сколько байт он экономит, сжаты ли CSS и JavaScript и сколько может сэкономить Brotli.
Часто задаваемые вопросы
Terser лучше, чем UglifyJS?
Будет ли минифицированный код работать точно так же?
eval, with или имена функций во время выполнения; для такого кода отключите переименование.