Джонатан Лай из Etsy рассказал, как его команда ускорила Webpack-сборку приложения — "The journey to fast production asset builds with Webpack".

Первая версия приложения собиралась самописным сборщиком "builda". Команда Etsy занималась его поддержкой, но не успевала за развитием js-экосистемы, поэтому было принято решение перевести сборку на Webpack. Главными требованием было время сборки — не более 5 минут.

Проект состоит из более 12000 модулей, которые с учётом одиннадцати локалей собираются в 13200 ассетов. Подход "в лоб" с использованием готовых Webpack-плагинов увеличил время сборки до 40 минут (сборка с использованием legacy-сборщика проходила за 5 минут). Основная проблема заключалась в лишней работе при генерации локалей. В итоге ребятя сделали своё решение, в котором ассеты для всех локалей генерируются один раз. Решили проблему со скоростью минификации файлов. Terser-webpack-plugin в их случае неэффективно работал с большим количеством модулей из-за того, что главный поток упирался в работу с диском и сериализовывал большое количество данных перед отправкой в воркеры. Процесс минификации вынесли из сборщика в отдельный шаг пост-процессинга.

Очень интересная статья. Рекомендую почитать, если используете Webpack.

#webpack #performance

https://codeascraft.com/2020/02/03/production-webpack-builds/