<b>Как уменьшить бандл без магии: Tree Shaking, split points и контроль зависимостей</b>

<b>Как уменьшить бандл без магии: Tree Shaking, split points и контроль зависимостей</b>

Большой бандл почти всегда растет не из-за «тяжелого фреймворка», а из-за мелочей: лишних импортов, общего utility-пакета и модулей, которые тянутся в первый экран. Давайте разберем под капотом.

Tree Shaking работает только там, где код действительно статический: ES-модули, без побочных эффектов при импорте, без “index.ts”, который собирает все подряд. Если библиотека помечает side effects честно — отлично. Если нет, сборщик оставит лишнее, и размер вырастет молча.

Code Splitting решает другую задачу: не убрать код, а отложить его загрузку. Делите по маршрутам, крупным виджетам, модалкам, редакторам, графикам. Не дробите каждый компонент: слишком мелкие чанки добавляют накладные запросы и ухудшают старт.

Что проверять в первую очередь:
— не импортируете ли вы весь пакет ради одной функции;
— нет ли barrel-файлов, которые ломают треешейкинг;
— не лежат ли тяжелые зависимости в общем entry-point;
— не попал ли в initial bundle код, который нужен только после клика.

<b>Вердикт для продакшена:</b> сначала убирайте лишние импорты и чистите entry-point, потом режьте по чанкам. Минимальный бандл — это не один трюк, а дисциплина в архитектуре зависимостей.