Без завантаження, 100% локально, без облікового запису

Мініфікація / форматування

Мініфікуйте чи форматуйте код. Усе залишається у вашому браузері.

Як працює Мініфікація / форматування

Мінімізація/краса стискає HTML, CSS та JavaScript, видаляючи коментарі, зайві пробіли та надлишкові символи, або розгортає мінімізований код назад у читабельну форму з відступами. Уся обробка відбувається у браузері за допомогою вбудованих парсерів; ніщо з вставленого не передається будь-куди. Ніщо з введеного тут не покидає пристрій.

Мінімізація безпосередньо впливає на продуктивність завантаження сторінки: менші файли передаються швидше, аналізуються швидше та споживають менше пропускної здатності. Для виробничих розгортань мінімізовані ресурси є стандартом. Цей інструмент корисний, коли ви отримуєте мінімізований файл, який потрібно прочитати (краса), коли хочете перевірити, що мінімізатор робить із фрагментом перед інтеграцією в конвеєр збірки, або коли потрібна швидка одноразова мінімізація без налаштування інструменту збірки.

Автор: Bastien Sulyan

Мініфікація / форматування: покрокова інструкція

  1. Вставте HTML, CSS або JavaScript-код у поле введення.
  2. Виберіть тип мови зі спадного меню (HTML, CSS або JavaScript).
  3. Натисніть «Мінімізувати» для отримання стиснутої версії або «Краса» для розгортання та розстановки відступів у коді.
  4. Скопіюйте результат із поля виводу за допомогою кнопки копіювання.
  5. Вставте інший код і повторіть за потреби.

Поширені сценарії використання

  • Front-end розробник хоче мінімізувати критичний CSS-фрагмент для вбудовування в head HTML для продуктивності вище лінії згину.
  • Розробник отримує мінімізований сторонній скрипт і потребує зробити його красивим, щоб зрозуміти його логіку під час перевірки безпеки.
  • Технічний автор потребує красиву версію мінімізованого тегу скрипту JSON-LD для включення в документацію.
  • Веб-розробник перевіряє заощадження байтів від мінімізації CSS-файлу перед вирішенням, чи додавати крок збірки.

Поширені запитання

Чи надсилається вставлений код на будь-який сервер для мінімізації?

Ні. Мінімізація та форматування виконуються власним кодом сторінки, написаним спеціально для цього інструмента, а не запозиченим у сторонньому мінімізаторі. Уся обробка залишається у вкладці браузера. Ніщо з вставленого тут не передається Sunasty чи будь-якій третій стороні.

Чи зберігає мінімізація JavaScript оригінальну поведінку коду?

Хороший мінімізатор зберігає поведінку, видаляючи лише пробіли, скорочуючи імена змінних у контрольованій області та видаляючи коментарі. Цей інструмент спрямований на безпечні перетворення. Агресивні оптимізації, як-от виключення мертвого коду або вбудовування функцій, загалом не застосовуються, оскільки вони вимагають повного аналізу програми.

Чи можна мінімізувати, а потім зробити красивим результат для перевірки?

Так. Спочатку мінімізуйте код, потім вставте мінімізований вивід назад у поле введення та натисніть «Краса». Красива версія виглядатиме інакше, ніж оригінальний вихідний код (імена змінних можуть бути скорочені, коментарі видалені), але буде структурно еквівалентною.

Чи видаляє мінімізація HTML усі коментарі?

Інструмент видаляє стандартні HTML-коментарі (<!-- ... -->) під час мінімізації. Умовні коментарі, що використовуються старими версіями IE (<!--[if IE]...-->), завжди зберігаються, тож видалення коментарів не може порушити застарілу поведінку, яка від них залежить.

Чи є обмеження за розміром коду, що можна мінімізувати?

Обмеженням є доступна пам'ять вкладки браузера. Код до кількох сотень кілобайт обробляється швидко. Для великих JavaScript-бандлів (мегабайти) спеціалізований інструмент збірки, як-от esbuild, Terser або Lightning CSS, є швидшим та більш підходящим для виробничого використання.

Схожі інструменти

Тримайте все локально, досліджуйте додаткові інструменти.

Усі інструменти розробника