webpack-bundle-analyzer 4.6.1 → 4.7.0

package/CHANGELOG.md

@@ -12,6 +12,11 @@ _Note: Gaps between patch versions are faulty, broken or test releases._
 
 ## UNRELEASED
 
+## 4.7.0
+
+ * **New Feature**
+   * Add the ability to filter to displaying only initial chunks per entrypoint ([#519](https://github.com/webpack-contrib/webpack-bundle-analyzer/pull/519) by [@pas-trop-de-zele](https://github.com/pas-trop-de-zele))
+
 ## 4.6.1
 
 * **Bug Fix**

package/README.md

@@ -1,6 +1,5 @@
 [![npm][npm]][npm-url]
 [![node][node]][node-url]
-[![deps][deps]][deps-url]
 [![tests][tests]][tests-url]
 [![downloads][downloads]][downloads-url]
 
@@ -211,9 +210,6 @@ To get more information about it you can read [issue #147](https://github.com/we
 [node]: https://img.shields.io/node/v/webpack-bundle-analyzer.svg
 [node-url]: https://nodejs.org
 
-[deps]: https://david-dm.org/webpack-contrib/webpack-bundle-analyzer.svg
-[deps-url]: https://david-dm.org/webpack-contrib/webpack-bundle-analyzer
-
 [tests]: http://img.shields.io/travis/webpack-contrib/webpack-bundle-analyzer.svg
 [tests-url]: https://travis-ci.org/webpack-contrib/webpack-bundle-analyzer
 

package/lib/analyzer.js

@@ -155,18 +155,24 @@ function getViewerData(bundleStats, bundleDir, opts) {
     asset.tree = createModulesTree(asset.modules);
     return result;
   }, {});
-  return Object.entries(assets).map(([filename, asset]) => ({
-    label: filename,
-    isAsset: true,
-    // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
-    // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
-    // be the size of minified bundle.
-    // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
-    statSize: asset.tree.size || asset.size,
-    parsedSize: asset.parsedSize,
-    gzipSize: asset.gzipSize,
-    groups: _.invokeMap(asset.tree.children, 'toChartData')
-  }));
+  const chunkToInitialByEntrypoint = getChunkToInitialByEntrypoint(bundleStats);
+  return Object.entries(assets).map(([filename, asset]) => {
+    var _chunkToInitialByEntr;
+
+    return {
+      label: filename,
+      isAsset: true,
+      // Not using `asset.size` here provided by Webpack because it can be very confusing when `UglifyJsPlugin` is used.
+      // In this case all module sizes from stats file will represent unminified module sizes, but `asset.size` will
+      // be the size of minified bundle.
+      // Using `asset.size` only if current asset doesn't contain any modules (resulting size equals 0)
+      statSize: asset.tree.size || asset.size,
+      parsedSize: asset.parsedSize,
+      gzipSize: asset.gzipSize,
+      groups: _.invokeMap(asset.tree.children, 'toChartData'),
+      isInitialByEntrypoint: (_chunkToInitialByEntr = chunkToInitialByEntrypoint[filename]) !== null && _chunkToInitialByEntr !== void 0 ? _chunkToInitialByEntr : {}
+    };
+  });
 }
 
 function readStatsFromFile(filename) {
@@ -200,4 +206,23 @@ function createModulesTree(modules) {
   modules.forEach(module => root.addModule(module));
   root.mergeNestedFolders();
   return root;
-}
+}
+
+function getChunkToInitialByEntrypoint(bundleStats) {
+  if (bundleStats == null) {
+    return {};
+  }
+
+  const chunkToEntrypointInititalMap = {};
+  Object.values(bundleStats.entrypoints || {}).forEach(entrypoint => {
+    for (const asset of entrypoint.assets) {
+      var _chunkToEntrypointIni;
+
+      chunkToEntrypointInititalMap[asset.name] = (_chunkToEntrypointIni = chunkToEntrypointInititalMap[asset.name]) !== null && _chunkToEntrypointIni !== void 0 ? _chunkToEntrypointIni : {};
+      chunkToEntrypointInititalMap[asset.name][entrypoint.name] = true;
+    }
+  });
+  return chunkToEntrypointInititalMap;
+}
+
+;

package/lib/template.js

@@ -45,6 +45,7 @@ function renderViewer({
   title,
   enableWebSocket,
   chartData,
+  entrypoints,
   defaultSizes,
   mode
 } = {}) {
@@ -66,6 +67,7 @@ function renderViewer({
     <div id="app"></div>
     <script>
       window.chartData = ${escapeJson(chartData)};
+      window.entrypoints = ${escapeJson(entrypoints)};
       window.defaultSizes = ${escapeJson(defaultSizes)};
     </script>
   </body>

package/lib/viewer.js

@@ -42,6 +42,7 @@ module.exports = {
   startServer,
   generateReport,
   generateJSONReport,
+  getEntrypoints,
   // deprecated
   start: startServer
 };
@@ -63,6 +64,7 @@ async function startServer(bundleStats, opts) {
     excludeAssets
   };
   let chartData = getChartData(analyzerOpts, bundleStats, bundleDir);
+  const entrypoints = getEntrypoints(bundleStats);
   if (!chartData) return;
   const sirvMiddleware = sirv(`${projectRoot}/public`, {
     // disables caching and traverse the file system on every request
@@ -74,6 +76,7 @@ async function startServer(bundleStats, opts) {
         mode: 'server',
         title: resolveTitle(reportTitle),
         chartData,
+        entrypoints,
         defaultSizes,
         enableWebSocket: true
       });
@@ -145,11 +148,13 @@ async function generateReport(bundleStats, opts) {
     logger,
     excludeAssets
   }, bundleStats, bundleDir);
+  const entrypoints = getEntrypoints(bundleStats);
   if (!chartData) return;
   const reportHtml = renderViewer({
     mode: 'static',
     title: resolveTitle(reportTitle),
     chartData,
+    entrypoints,
     defaultSizes,
     enableWebSocket: false
   });
@@ -204,4 +209,12 @@ function getChartData(analyzerOpts, ...args) {
   }
 
   return chartData;
+}
+
+function getEntrypoints(bundleStats) {
+  if (bundleStats === null || bundleStats === undefined) {
+    return [];
+  }
+
+  return Object.values(bundleStats.entrypoints || {}).map(entrypoint => entrypoint.name);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "webpack-bundle-analyzer",
-  "version": "4.6.1",
+  "version": "4.7.0",
   "description": "Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap",
   "author": "Yury Grunin <grunin.ya@ya.ru>",
   "license": "MIT",