Skip to content
1 / 13

Сборка фронтенда для прода: чанки, tree-shaking и что делать с source maps

Сборка превращает исходники в набор файлов, которые скачает браузер, и решения здесь напрямую определяют скорость первой загрузки. Разбиение на чанки: общий код выносится в отдельные файлы, страницы и тяжёлые библиотеки грузятся по требованию; главный критерий — не число чанков, а объём, который нужен для первого экрана. Tree-shaking удаляет неиспользуемый код, но работает только на ES-модулях и ломается о побочные эффекты, поэтому в package.json библиотек важно поле sideEffects. Source maps нужны, чтобы читать ошибки из прода, но выкладывать их публично значит отдать исходники: правильный вариант — генерировать и загружать в систему мониторинга ошибок, а с CDN не раздавать. Отдельная тема — детерминированность: сборка должна давать одинаковый результат для одинакового входа, иначе кэш ломается при каждом деплое, а расследование инцидента упирается в «у меня собралось иначе».

Сборка фронтенда для прода: чанки, tree-shaking и что делать с source maps | JScriptiser