Skip to main content

Що робить мініфікація?

Frontend-інструментиJunior~1 хв читання
Запропонувати правку

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

Що робить мініфікатор:

  1. Видаляє пробіли, переноси рядків і таби

Було:

js
function sum(a, b) { return a + b; }

Стало:

js
function sum(a,b){return a+b;}
  1. Перейменовує змінні і функції

Довгі імена скорочуються до a, b, c тощо. 3. Видаляє коментарі 4. Інлайнить і оптимізує вирази

Об'єднує інструкції, прибирає зайві конструкції. 5. Іноді: прибирає «мертвий» код

(якщо увімкнена прод-збірка і tree shaking)

Результат:

  • розмір файлу зменшується на 30-90%
  • код стає нечитабельним, але працює так само
  • завантажується швидше, парситься швидше

Приклади мініфікаторів:

  • Terser (для JS)
  • esbuild, SWC (нове покоління)
  • csso, clean-css (для CSS)
  • html-minifier (для HTML)

Висновок: Мініфікація - це спосіб стиснути код до межі, щоб він був якомога меншим і швидше доходив до користувача.

Коротка відповідь

Для співбесіди
Premium

Коротка відповідь допоможе вам впевнено відповідати на цю тему під час співбесіди.

Запропонувати правку