Код и разработка

Карта размеров бандла

Из stats.json webpack, Vite или esbuild рисует карту модулей и топ тяжёлых зависимостей.

Файл статистики

webpack: webpack --json > stats.json. Vite и esbuild: metafile: true. Файл читается в браузере и никуда не уходит.

…или вставьте JSON

{
 "assets": [
  {
   "name": "main.js",
   "size": 742000
  },
  {
   "name": "vendor.js",
   "size": 1180000
  }
 ],
 "modules": [
  {
   "name": "./node_modules/moment/moment.js",
   "size": 288000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/moment/locale/ru.js",
   "size": 12000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/lodash/lodash.js",
   "size": 531000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/chart.js/dist/chart.js",
   "size": 246000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/vue/dist/vue.runtime.esm-bundler.js",
   "size": 132000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js",
   "size": 41000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./node_modules/axios/lib/axios.js",
   "size": 58000,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./src/pages/index.vue",
   "size": 21400,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./src/pages/catalog.vue",
   "size": 18800,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./src/components/Chart.vue",
   "size": 9600,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./src/lib/format.js",
   "size": 3100,
   "chunks": [
    "main"
   ]
  },
  {
   "name": "./src/lib/api.js",
   "size": 4700,
   "chunks": [
    "main"
   ]
  }
 ]
}

Всего

1,3 МБ

Зависимости

1,2 МБ

Свой код

56 КБ

Модулей

Карта: по пакетам

Площадь блока пропорциональна размеру. Наведите курсор — во всплывающей подсказке точные цифры.

Топ тяжёлых

Пакет	Размер	Доля	Модулей
lodash из node_modules	519 КБ	38.9 %	1
moment из node_modules	293 КБ	22 %	2
chart.js из node_modules	240 КБ	18 %	1
vue из node_modules	129 КБ	9.7 %	1
axios из node_modules	57 КБ	4.2 %	1
src/	56 КБ	4.2 %	5
@vue/reactivity из node_modules	40 КБ	3 %	1

Файлы на выходе

vendor.js1,1 МБ
main.js725 КБ