Angular 18.04.2019 admin No comments

Анализ размера Angular билда

В данной статье будет описан способ узнать из чего именно состоит Angular билд, а также сколько в отдельности весит каждая часть. Для этого будет использоваться библиотека webpack-bundle-analyzer.

Для теста я буду использовать чистый Angular проект, сгенерированный при помощи @angular/cli (ng new test-app).

Шаги:

— Добавление библиотеки webpack-bundle-analyzer:

npm install webpack-bundle-analyzer --save-dev

— Добавление скрипта в секцию scripts файла package.json:

Версия для Angular 6+ приложений:

"analyze": "ng build --prod --stats-json && webpack-bundle-analyzer dist/test-app/stats.json"

Версия для Angular приложений, ниже 6 версии:

"analyze": "ng build --prod --stats-json && webpack-bundle-analyzer dist/stats.json"

Запуск скрипта:

npm run analyze

Результат:

анализ Angular билда

Для сравнения я также проанализировал репозиторий ngx-admin:

ngx-admin


Расширение для Google Chrome для улучшения памяти от автора данного блога - Colorobrain.




1 Звезда2 Звезды3 Звезды4 Звезды5 Звезд (1 оценок, среднее: 5,00 из 5)
Загрузка...